如何在将Angular范围属性传递给指令时更新它们?

时间:2016-11-08 20:42:34

标签: angularjs

我有一些功能,开发人员可以添加自定义Angular视图,它们可以将属性绑定到$ scope.settings对象。单击保存按钮时,$ scope.settings对象将转换为JSON并保存到数据库。这样的结果将是结果:

{
    "name": "bob",
    "age": "25"
}

只要我添加<input type="text" ng-model="settings.name" />等元素,一切都按预期进行。

但是,现在我想添加这样的指令:

<umb-property property="property in properties">
    <umb-editor model="property"></umb-editor>
</umb-property>

使用以下代码:

$scope.properties = [
    {
        label: 'Name',
        alias: 'name',
        view: 'textbox',
        value: $scope.settings.name
    },
    {
        label: 'Age',
        alias: 'age',
        view: 'number',
        value: $scope.settings.age
    }
];

&#39;编辑&#39;指令根据&#39;视图加载视图。属性。意见是第三方。编辑器加载到对话框中。提交设置对话框后,以下代码行将设置转换为JSON:

$scope.dialog = {
     submit: function (model) {
         var settingsJson = JSON.stringify(model.settings);
     },
     close: function (oldModel) {
         //
     }
 };

在这种情况下,我无法将$ scope.settings解析为JSON,因为$ scope.settings.name不再更新。 $ scope.editorModel.value已更新。

如何将$ scope.editorModel.value绑定到$ scope.settings.name? 我不想最终得到一个解决方案,我必须使用编辑器模型中的相应值更新所有$ scope.settings值,因为我想支持将$ scope.settings转换为JSON的动态方式数据库中的值。

1 个答案:

答案 0 :(得分:0)

  

例如我不想这样做:$scope.settings.name = $scope.properties[0].value

使用property accessors

for (var i=0; i<$scope.properties.length; i++) {
    $scope.settings[$scope.properties[i].alias] = $scope.properties[i].value;
};

HTML

<div ng-repeat="prop in properties">
    <input ng-model="prop.value">
</div>