mseemann / angular2-mdl Goto Github PK
View Code? Open in Web Editor NEWAngular 2 - 14 components, directives and styles based on material design lite (npm: @angular-mdl/core)
Home Page: https://mseemann.io/angular2-mdl
License: MIT License
Angular 2 - 14 components, directives and styles based on material design lite (npm: @angular-mdl/core)
Home Page: https://mseemann.io/angular2-mdl
License: MIT License
set a default id and use this id for the input element id-attribute and the label for-attribute
Hey Mseemann,
I will be testing out the new features tonight for the validity checking but i had one other thing i ran into:
When using radio buttons with a reactive group the radio button view never updates. What i mean is that when you select a radio button, the selection in the group is updated, but ALL of the radio buttons selected stay colored.
<mdl-radio name="group1" formControlName="value" [formGroup]="formGroup1" value="1" mdl-ripple>1</mdl-radio>
<mdl-radio name="group1" formControlName="value" [formGroup]="formGroup1" value="2" mdl-ripple>2</mdl-radio>
<mdl-radio name="group1" formControlName="value" [formGroup]="formGroup1" value="3" mdl-ripple>3</mdl-radio>
<mdl-radio name="group1" formControlName="value" [formGroup]="formGroup1" value="4" mdl-ripple>4</mdl-radio>
<mdl-radio name="group1" formControlName="value" [formGroup]="formGroup1" value="5" mdl-ripple>5</mdl-radio>
This is similar to the code i was using. Also i was on chrome and have not tested on other browsers yet. Any tips or does this look like a bug? (Maybe not redrawing the elements or something?)
Possible workaround avoiding a complete redesign of the build process: https://github.com/postcss/postcss-cli
I get a 404 when accessing http://mseemann.io/angular2-mdl. Is this still the correct link?
Hi,
Is there a way to add a 'required' attribute to the mdl-textfield similar to the disabled attribute?
very nice project, I think really choose it to my next project.
It will be fine to add
I think if you add milestone...what will be furthur developement, what do you plan to add and when? what's in your shortlist ... maybe something like this will avoid issue like mine.
I am seeing that if I use reactive forms and build a FormGroup with validators on fields it works fine on its own. Then when i add pattern and error-msg to a textField (that matches the FormGroup validators), the FormGroup is ALWAYS invalid. Any ideas on this?
Even if i dont have a pattern validator on the FormGroup it still happens.
Side note, the URL in the readme isnt updated to http://mseemann.io/angular2-mdl/ yet :)
did not work on touch devices
Looks like latest version in master is Angular RC5, but readme indicates otherwise. Is RC5 supported?
Also, documentation is for systemJS. Is webpack supported?
Thank you for your great work. I am using MDL with angular2 for some time but not with such a component abstraction (was not aware of this library until recently)
So, I am trying it out, and first the tabs component....
When I set the selectIndex property programmatically nothing happens.
Would be really good to be able to switch the selected tab.
What do you think?
And one more. I use the tab panels also with icons (instead of title). And more customizations.. (title with icons - and icons are dynamically show or hidden)
So a great improvement would be a construct like:
<mdl-tab-panel>
<mdl-tab-panel-title>Do whatever you want</mdl-tab-panel-title>
</mdl-tab-panel>
track the ticket: google/material-design-lite#4673
and remove the workaround if this is fixed.
Hi,The project is very awesome.
When i use button,look like they have a diffrerent for getmdl;
When repeatedly the button,angular2-mdl will select that icon,but getmdl is not;
angular2-mdl will show a blue selected area,like text seleted.
If change
mdl-button to button
the show style is same.So i think this is a style issue.
Demo url with http://mseemann.de/angular2-mdl/button
https://getmdl.io/components/index.html#buttons-section
Currently i am seeing that i cannot get chromes autofill to work on any of the text inputs from angular2-mdl. If you use standard MDL CSS you can normally double click a field with name and id (say username) and it will drop down a list of previously entered values.
I havent looked into the code enough to know why this would be happening, but have you noticed this as well? Has anyone seen similar issues on other browsers?
Thanks!
Code without an explicit license is protected by copyright and is by default All Rights Reserved.
Perhaps this was your intention, however it would be helpful to state as much explicitly.
http://choosealicense.com has good explanations of various licenses.
avoid using templateUrl or stylesUrl
Hi!
Is mdl-textfield compatible with angular/forms?
Is there a way to pass name and id attributes to the input element?
These code:
<form (ngSubmit)="generate(reportForm.value)">
<mdl-textfield type="text"
label="IDs"
[(ngModel)]="reportParams.userIds"
floating-label
ngControl="userIds"
name="userIds"
required
></mdl-textfield>
</form>
produces error:
vendor.js:43701 EXCEPTION: Error: Uncaught (in promise): No value accessor for form control with name: 'userIds'
Maybe, I'm doing something wrong.
npm: Angular2 rc5, angular/forms 0.3.0, angular2-mdl 1.3.0.
Hi, when i'm using mdl-table-selectable it gives
EXCEPTION: Error in http://localhost:4200/vendor/angular2-mdl/dist/components/table/mdl-table.component.js class MdlSelectableTableComponent - inline template:5:42
browser_adapter.ts:82 ORIGINAL EXCEPTION: No value accessor for ''
any idea?
Hi,
I did not find any date-picker and drop-down in angular2-mdl.
Can anybody suggest where can I get these 2 component with Angular2 and material design.
Thanks
Ananda
Hi,
I have created a new project using Angular2-mdl with gulp.
I got the following error while adding
import { MDL_DIRECTIVES } from 'angular2-mdl'; @Component{ directives: [ MDL_DIRECTIVES ] }
zone.js:461 Unhandled Promise rejection: Template parse errors: Can't bind to 'mdl-ripple' since it isn't a known native property (" (click)="mdlLayout.tabSelected(tab)" class="mdl-layout__tab" [ERROR ->][mdl-ripple]="isRipple" [ngClass]="{'is-active': tab.isActive}">{{tab.title}}</a> "): MdlLayoutHeaderComponent@7:16 ; Zone: angular ; Task: Promise.then ; Value: BaseException$1consoleError @ zone.js:461
If I didn't add this then only text is visible in demo app.
Please help me on this.
It will be great if you create a seed project using angular2-mdl
Thanks,
Ananda
The first impression of angular2-mdl is really good and it looks "professional".
But I am curious what the intention of angular2-mdl is...
e.g.
TIA
on touch devices the menu did not close if one touches anywhere on the document.
see: angular/protractor#3016
upgrade to protractor 4.x
mdl-textfield does not support the autofocus attribute.
It also doesn't look like the focus/blur events are available to catch.
Eg.
<mdl-textfield (blur)="doStuff()">
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.