Javascript AngularJS-带“的动态NGM模型；key.key.key..value“；

我知道这看起来像一个重复的问题，但我找不到任何与此相关的东西

我有一个变量，比如

“settings.page.header.title”

我想动态地将输入的

ngModel

设置到上面，因为它会改变

---

我尝试了以下方法但没有成功：

(一)

$scope.getDynamicModel=函数（str）{
风险值水平=str.split（“.”）；
var模型=$scope；
对于（变量i=0，i

(二)

---

有什么想法吗？

html

---

编写了一个可能有帮助的指令：

app.directive('myModel', function($compile){
  return {
    link: function(scope,elm,attrs){
      elm.removeAttr('my-model');
      scope.$watch(attrs.myModel, function(value){
        if (value)
          $compile(elm.attr('ng-model',value))(scope)
      })
    }
  }
})

这将添加一个监视程序，该监视程序将更新元素的

ng模型

，并重新编译。删除

my model

是为了避免无限编译元素

---

为防止故障进行一些修改：

$scope.getDynamicModel = function(str) {
    var levels = str.split(".");
    var model = $scope;
    for (var i = 0; i < levels.length; i++) {
        var level = levels[i];
        model = model[level];

        if (model == null) { 
            return model;
        }
    }

    return model;
}

$scope.getDynamicModel=函数（str）{
风险值水平=str.split（“.”）；
var模型=$scope；
对于（变量i=0；i

---

请参见

删除model属性中函数调用中的单引号。我认为这不是OP的意思。是的，这不是我的意思对不起。需要$scope变量名是动态的。

<input ng-model="{{ 'settings.page.header.title' }}">

<input ng-model="settings.page.header.title" type="text">

$scope.settings = {
  page: {
    header: {
      title: 'myTitle'
    }
  }
}

app.directive('myModel', function($compile){
  return {
    link: function(scope,elm,attrs){
      elm.removeAttr('my-model');
      scope.$watch(attrs.myModel, function(value){
        if (value)
          $compile(elm.attr('ng-model',value))(scope)
      })
    }
  }
})

$scope.getDynamicModel = function(str) {
    var levels = str.split(".");
    var model = $scope;
    for (var i = 0; i < levels.length; i++) {
        var level = levels[i];
        model = model[level];

        if (model == null) { 
            return model;
        }
    }

    return model;
}