1

这令人费解。这是一件很简单的事情,但我无法让它工作。我正在单击按钮(最初)向表单添加一个输入字段。在这一点上,我只是想查看视图中的任何值(因此是简单的 p 标签)

HTML 视图

<span>Add secondary field</span>
<md-button class="md-fab md-mini" ng-click="vm.addVals()">
    <i class="material-icons">add</i>
</md-button>

<div ng-if="moreVal">
    <div data-ng-repeat="vl in valHolder.valArr track by $index">
    <p>My Value: {{vl.myVal}}</p>
</div>

控制器

 function EditFormController($scope, $sanitize, ngToast) {
  var vm = this;
  vm.addVals = addVals;
  $scope.valHolder= {valArr: []};
  function addVals(){
   var ln = $scope.valHolder.valArr.length;
   $scope.valHolder.valArr.push({myVal: 'Test'+ln});  
   $scope.moreVal = true;
  }
 }());

我检查了 valArr 是否在按钮单击时填充了新的 myVal 值。但我在视图中看不到任何东西。ng-repeat div 是空的。为什么会这样?我整天都在寻找解决方案,但这太荒谬了,似乎没有人遇到这个问题。不知道我做错了什么。我真的很感激一个答案。

4

3 回答 3

0

在您的控制器中编写以下代码:

var self = this;
self.valHolder= {valArr: []};
function addVal(){
  var ln = self.valHolder.valArr.length;
  self.valHolder.valArr.push({myVal: 'Test'+ln});  
  self.moreVal = true;
}

写在您的 HTML 中,如下所示:

<div ng-if="moreVal">
    <div data-ng-repeat="vl in vm.valHolder.valArr track by $index">
    <p>My Value: {{vl.myVal}}</p>
</div>
于 2017-02-22T13:08:04.343 回答
0

您的 addVal 函数没有被调用。请将您的 HTML 视图更改为 -

<span>Add secondary field</span>
<md-button class="md-fab md-mini" ng-click="addVal()">
    <i class="material-icons">add</i>
</md-button>

<div ng-if="moreVal">
    <div data-ng-repeat="vl in valHolder.valArr track by $index">
    <p>My Value: {{vl.myVal}}</p>
</div>

和控制器代码到这个 -

 $scope.valHolder = { valArr: [] };
 $scope.addVal = function () {
    var ln = $scope.valHolder.valArr.length;
    $scope.valHolder.valArr.push({ myVal: 'Test' + ln });
    $scope.moreVal = true;
 }

如果您使用 ControllerAs 语法并且您指定了 controllerAs:"vm",那么您的代码将在下面

<span>Add secondary field</span>
<md-button class="md-fab md-mini" ng-click="vm.addVal()">
    <i class="material-icons">add</i>
</md-button>

<div ng-if="vm.moreVal">
    <div data-ng-repeat="vl in vm.valHolder.valArr track by $index">
    <p>My Value: {{vl.myVal}}</p>
</div>

和控制器代码到这个 -

var self = this;
 self.valHolder = { valArr: [] };
 self.addVal = function () {
    var ln = self.valHolder.valArr.length;
    self.valHolder.valArr.push({ myVal: 'Test' + ln });
    self.moreVal = true;
 }
于 2017-02-22T13:00:29.337 回答
0

您正在使用ng-click="vm.addVals()"$scope在控制器中。

我认为你也应该var vm在控制器中使用。添加这些行:

var vm = this;
vm = {};

vm.addVals = addVals;
于 2017-02-22T13:04:32.607 回答