#886 vn-check refactor to use the info property

This commit is contained in:
Gerard 2018-12-11 12:57:07 +01:00
parent 4e5ab09ee7
commit c0e6865523
3 changed files with 21 additions and 2 deletions

View File

@ -2,3 +2,8 @@
<input type="checkbox" class="mdl-checkbox__input"/>
<span class="mdl-checkbox__label" translate>{{::$ctrl.label}}</span>
</label>
<i class="material-icons"
ng-if="$ctrl.hasInfo"
vn-tooltip="{{$ctrl.info}}">
info_outline
</i>

View File

@ -3,11 +3,14 @@ import Input from '../../lib/input';
import './style.scss';
export default class Controller extends Input {
constructor($element, $scope) {
constructor($element, $scope, $attrs, vnTemplate) {
super($element, $scope);
vnTemplate.normalizeInputAttrs($attrs);
componentHandler.upgradeElement(this.element.firstChild);
this.mdlElement = this.element.firstChild.MaterialCheckbox;
this.input.addEventListener('change', () => this.onChange());
this.hasInfo = Boolean($attrs.info);
this.info = $attrs.info || null;
}
set field(value) {
this._field = value;
@ -35,7 +38,7 @@ export default class Controller extends Input {
this.$.$applyAsync();
}
}
Controller.$inject = ['$element', '$scope', '$injector'];
Controller.$inject = ['$element', '$scope', '$attrs', 'vnTemplate'];
ngModule.component('vnCheck', {
template: require('./check.html'),

View File

@ -1,5 +1,16 @@
@import 'colors';
vn-check {
position: relative;
& > .mdl-checkbox {
width: initial;
}
& > i {
padding-left: 5px;
position: absolute;
bottom: 3px;
color: $secondary-font-color;
font-size: 20px !important
}
}