bug fixed: login
This commit is contained in:
parent
22f2d3e7f3
commit
c90be5bd04
|
@ -1,18 +1,20 @@
|
||||||
<div class="mdl-textfield mdl-js-textfield {{$ctrl.className}}">
|
<div class="mdl-textfield mdl-js-textfield {{$ctrl.className}}">
|
||||||
<input
|
<input
|
||||||
class="mdl-textfield__input"
|
class="mdl-textfield__input"
|
||||||
type="{{$ctrl.type}}"
|
type="{{$ctrl.type}}"
|
||||||
name="{{$ctrl.name}}"
|
name="{{$ctrl.name}}"
|
||||||
ng-model="{{$ctrl.model}}"
|
ng-model="$ctrl.value"
|
||||||
vn-validation="{{$ctrl.rule}}"
|
vn-validation="$ctrl.rule"
|
||||||
ng-disabled="{{$ctrl.disable}}"/>
|
ng-disabled="$ctrl.disable"
|
||||||
<button
|
/>
|
||||||
type="button"
|
<button
|
||||||
class="mdl-chip__action"
|
type="button"
|
||||||
tabindex="-1"
|
class="mdl-chip__action"
|
||||||
translate-attr="{title: 'Clear'}"
|
tabindex="-1"
|
||||||
style="visibility: hidden">
|
translate-attr="{title: 'Clear'}"
|
||||||
|
style="visibility: hidden"
|
||||||
|
>
|
||||||
<i class="material-icons">clear</i>
|
<i class="material-icons">clear</i>
|
||||||
</button>
|
</button>
|
||||||
<label class="mdl-textfield__label" translate="{{$ctrl.label}}"></label>
|
<label class="mdl-textfield__label">{{$ctrl.label | translate}}</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,16 +1,20 @@
|
||||||
import {module} from '../module';
|
import { module } from '../module';
|
||||||
|
import Component from '../lib/component';
|
||||||
// import * as resolveFactory from '../lib/resolveDefaultComponents';
|
// import * as resolveFactory from '../lib/resolveDefaultComponents';
|
||||||
// import * as normalizerFactory from '../lib/inputAttrsNormalizer';
|
// import * as normalizerFactory from '../lib/inputAttrsNormalizer';
|
||||||
import './style.scss';
|
import './style.scss';
|
||||||
// import './textfield.mdl';
|
// import './textfield.mdl';
|
||||||
|
|
||||||
export default class TextfieldController {
|
export default class TextfieldController extends Component {
|
||||||
constructor($element, $scope, $attrs) {
|
constructor($element, $scope, $attrs) {
|
||||||
|
super($element);
|
||||||
|
|
||||||
this.$scope = $scope;
|
this.$scope = $scope;
|
||||||
this.$attrs = $attrs;
|
this.$attrs = $attrs;
|
||||||
let input = this.input = this.$element.querySelector('input');
|
this.$element = $element[0];
|
||||||
|
|
||||||
|
let input = this.input = $element[0].querySelector('input');
|
||||||
|
|
||||||
input.addEventListener('input',
|
input.addEventListener('input',
|
||||||
() => this.checkValue());
|
() => this.checkValue());
|
||||||
input.addEventListener('focus',
|
input.addEventListener('focus',
|
||||||
|
@ -27,7 +31,17 @@ export default class TextfieldController {
|
||||||
let div = this.$element.firstChild;
|
let div = this.$element.firstChild;
|
||||||
componentHandler.upgradeElement(div);
|
componentHandler.upgradeElement(div);
|
||||||
|
|
||||||
Object.assign(this, $attrs);
|
this._value = null;
|
||||||
|
|
||||||
|
this.type = this.$attrs.type || 'text';
|
||||||
|
}
|
||||||
|
|
||||||
|
get value() {
|
||||||
|
return this._value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set value(value) {
|
||||||
|
this._value = (value === undefined || value === '') ? null : value;
|
||||||
}
|
}
|
||||||
|
|
||||||
$onInit() {
|
$onInit() {
|
||||||
|
@ -37,9 +51,10 @@ export default class TextfieldController {
|
||||||
this.$scope.$watch(this.$attrs.model,
|
this.$scope.$watch(this.$attrs.model,
|
||||||
() => mdlTextField.updateClasses_());
|
() => mdlTextField.updateClasses_());
|
||||||
|
|
||||||
let $input = angular.$element(this.input);
|
/* let $input = angular.element(this.input);
|
||||||
$input.controller('ng-model').$parsers.push(value => value === '' ? null : value);
|
$input.controller('ng-model').$parsers.push(value => value === '' ? null : value);*/
|
||||||
}
|
}
|
||||||
|
|
||||||
onClearClick() {
|
onClearClick() {
|
||||||
this.input.value = null;
|
this.input.value = null;
|
||||||
this.checkValue();
|
this.checkValue();
|
||||||
|
@ -48,23 +63,21 @@ export default class TextfieldController {
|
||||||
event.initEvent('change', false, true);
|
event.initEvent('change', false, true);
|
||||||
this.input.dispatchEvent(event);
|
this.input.dispatchEvent(event);
|
||||||
}
|
}
|
||||||
|
|
||||||
checkValue() {
|
checkValue() {
|
||||||
this.showClear(this.input.value);
|
this.showClear(this.input.value);
|
||||||
}
|
}
|
||||||
|
|
||||||
showClear(show) {
|
showClear(show) {
|
||||||
show = show && document.activeElement === this.input;
|
show = (show && document.activeElement === this.input);
|
||||||
let clearButton = this.$element.querySelector('button');
|
let clearButton = this.$element.querySelector('button');
|
||||||
clearButton.style.visibility = show ? 'visible' : 'hidden';
|
clearButton.style.visibility = show ? 'visible' : 'hidden';
|
||||||
}
|
}
|
||||||
/**
|
|
||||||
* Selects the textfield.
|
|
||||||
*/
|
|
||||||
select() {
|
select() {
|
||||||
this.input.select();
|
this.input.select();
|
||||||
}
|
}
|
||||||
/**
|
|
||||||
* Puts the focus on the textfield.
|
|
||||||
*/
|
|
||||||
focus() {
|
focus() {
|
||||||
this.input.focus();
|
this.input.focus();
|
||||||
}
|
}
|
||||||
|
@ -73,5 +86,8 @@ TextfieldController.$inject = ['$element', '$scope', '$attrs'];
|
||||||
|
|
||||||
module.component('vnTextfield', {
|
module.component('vnTextfield', {
|
||||||
template: require('./textfield.html'),
|
template: require('./textfield.html'),
|
||||||
controller: TextfieldController
|
controller: TextfieldController,
|
||||||
|
bindings: {
|
||||||
|
value: '=model'
|
||||||
|
}
|
||||||
});
|
});
|
Loading…
Reference in New Issue