如何在角度指令4

时间:2018-02-26 06:39:00

标签: jquery html angular angular-directive

Hello All我使用angular directive 1.6来访问数字文本框控件的ate属性 这是我的指示

app.directive('numerictextbox', function () {
    return {
        restrict: 'EA',
        require: 'ngModel',
        replace: true,
        template: '<input type="number" />',

        scope: {
            id: '@',
            ngModel: '=',
            min: '@',
            max: '@'
        },
        link: function (scope, element) {

            element.on('change', function () {
                scope.ngModel
                scope.$applyAsync();

            })
        }

    };

这是我的控制

<numerictextbox id="txtid2" min="1" max="4" ng-model="txt2"></numerictextbox>

所以问题是如何在angular指令中得到控制属性值是我的 angular 4指令

@Directive({
        selector: '[number]'

})

我们如何在angular 4指令中使用范围 任何人请帮助

1 个答案:

答案 0 :(得分:1)

使用@Input()装饰器

将属性添加到Directive类中
@Directive({
    selector: '[selectable]'
})
export class SelectableDirective{
    private el: HTMLElement;

    @Input('selectable') option:any;   
    @Input('first') f;
    @Input('second') s;

    ...
}

在模板中将绑定属性传递给li元素

<li *ngFor = 'let opt of currentQuestion.options' 
    [selectable] = 'opt' 
    [first]='YourParameterHere'
    [second]='YourParameterHere'
    (selectedOption) = 'onOptionSelection($event)'>
    {{opt.option}}
</li>

我已经用这种方式实现了。这在我的项目中工作得很好。请试试。