Question

我们正在开发自己的AngularJs（1.6.x）组件/指令库，我们希望将我们组件上指定的所有HTML属性自动并动态地传递给底层模板，而不必将每个属性指定为绑定。

例如，如果我有一个类似<my-component>的组件，其中包含<div class="my-component"></div>这样的模板，并且我在我的HTML中写道：

<my-component ng-required="ctrl.isRequired" ng-change="ctrl.onChange()" ng-attr-disabled="ctrl.isReadOnly"></my-component>

我希望我的模板呈现：

<div class="my-component" ng-required="ctrl.isRequired" ng-change="ctrl.onChange()" ng-attr-disabled="ctrl.isReadOnly"></div>

正如我上面所说，我们事先无法知道所有属性，因此无法在组件绑定中定义它们。 Angular 1.5+中的问题变得更加复杂，因为replace已被弃用，因此上述模板将呈现如下内容：

<my-component ng-required="ctrl.isRequired" ng-change="ctrl.onChange()" ng-attr-disabled="ctrl.isReadOnly">
    <div class="my-component" ng-required="ctrl.isRequired" ng-change="ctrl.onChange()" ng-attr-disabled="ctrl.isReadOnly"></div>
</my-component>

而且，当我们有嵌套的深层次组件时，我们希望将值从父控制器传递给（大）子节点，即ctrl.onChange()方法将在范围内定义页面控制器定义了<my-component>，但是当层次结构中的每个组件都有自己的范围时，随着您的深入，我们希望该方法仍然可以调用。

我对Angular相对较新，我希望上述内容有道理。

AngularJs（1.5+）动态绑定

0 个答案: