如何在角度指令 4 中使用范围

Posted 2023-02-22

【中文标题】如何在角度指令 4 中使用范围

【英文标题】：how to use scope in angular directive 4

【发布时间】：2018-08-05 13:40:43

【问题描述】：

大家好，我正在使用 Angular 指令 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 指令中使用作用域 有人请帮忙

【问题讨论】：

使用`@Input()`获取数据。

请您详细说明

【参考方案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>

我已经以这种方式实现了。这在我的项目中运行良好。请尝试一下。

【讨论】：

我想要 html 中为 1 的最小值，那么我如何在指令中访问该值

试试这个min = "1"

不工作我想尝试访问 angular 指令中的最小值，在 HTML 控件中为 1

请通过链接。我已经实现了与文档中给出的相同的方式，它可以工作

你能再提出一个解决方案，所以我会标记它是正确的