Javascript 视图中未显示形式的角动态场

这令人困惑。这是一件很简单的事情，但我无法让它工作。我通过单击按钮（最初）将输入字段添加到表单中。在这一点上，我只是试图看到视图中的任何值（因此是简单的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>

---

我已经检查了valArr是否在单击按钮时填充了新的myVal值。但我看不到任何东西。ng repeat div为空。为什么会这样？我一整天都在寻找解决办法，但这太荒谬了，似乎没有人有这个问题。不知道我做错了什么。非常感谢您的回答。

您的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>

如果您使用的是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>

---

未调用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>

如果您使用的是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>

---

您正在控制器中使用

ng click=“vm.addVals（）”

和

$scope

我认为您也应该在控制器中使用

var-vm

。添加以下行：

var vm = this;
vm = {};

及

---

您正在控制器中使用

ng click=“vm.addVals（）”

和

$scope

我认为您也应该在控制器中使用

var-vm

。添加以下行：

var vm = this;
vm = {};

及

---

在控制器中编写以下代码：

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>

我的值：{{vl.myVal}}

在控制器中编写以下代码：

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>

我的值：{{vl.myVal}}

console中是否有任何错误？是否在视图中使用controller作为语法？你能显示你的全部HTML代码吗？@Mistalis中没有错误console@Ankit瓦迪：是的，我是，但似乎不是为了这个功能。是吗？@AnkitVadi您是对的，当我在视图中将控制器用作语法时，使用$scope是导致错误的原因。请写下这个作为答案，这样我可以选择它。谢谢。您在控制台中有任何错误吗？在视图中是否使用控制器作为语法？你能显示你的全部HTML代码吗？@Mistalis中没有错误console@Ankit瓦迪：是的，我是，但似乎不是为了这个功能。是吗？@AnkitVadi您是对的，当我在视图中将控制器用作语法时，使用$scope是导致错误的原因。请写下这个作为答案，这样我可以选择它。谢谢。正在调用addVal函数。这是我的错别字。很抱歉我正在调试控制台语句，我知道valArr的填充是正确的。问题只是视图没有显示任何内容。我只是在我的末端尝试了一下，我给出的解决方案是有效的。您是否在控制器代码中添加了$scope.addVal=function（）{…}请查找我的更新答案如果您使用的是controllerAs syntaxYes，这就是问题所在，Ankit Vadi首先得到了答案，因此已授予他答案。正在调用addVal函数。这是我的错别字。很抱歉我正在调试控制台语句，我知道valArr的填充是正确的。问题只是视图没有显示任何内容。我只是在我的末端尝试了一下，我给出的解决方案是有效的。您是否在控制器代码中添加了$scope.addVal=function（）{…}请查找我的更新答案，如果您使用的是controllerAs syntaxYes，这就是问题所在，Ankit Vadi首先得到了答案，因此我们授予了他答案。我同意这一冲突是导致问题的原因，但Ankit Vadi首先得到了答案。谢谢，我同意这场冲突是问题的根源，但安基特·瓦迪首先找到了答案。谢谢，HTML中不应该是self.valHolder.valArr吗？不，您正在使用类似ng controller=“EditFormController as vm”的语法，对吗？然后在您的视图中，self将被引用为vm。或者，如果您在路由中定义它，它将像controller:“EditFormController”和controllerAs:“vm”实际上我没有，我只指定了ng controller=“EditFormController”，它似乎工作得很好。我不确定我是否遗漏了什么。仍然在用Angular学习诀窍，所以请原谅我的无知；我已经写了var self=this；。所以基本上vm和self都指向同一个对象。如果vm在视图中运行良好，您也可以使用vm，因为两者最终都是相同的对象。它不应该是HTML中的self.valHolder.valArr吗？不，您使用的语法类似于ng controller=“EditFormController as vm”对吗？然后在您的视图中，self将被引用为vm。或者，如果您在路由中定义它，它将像controller:“EditFormController”和controllerAs:“vm”实际上我没有，我只指定了ng controller=“EditFormController”，它似乎工作得很好。我不确定我是否遗漏了什么。仍然在用Angular学习诀窍，所以请原谅我的无知；我已经写了var self=this；。所以基本上vm和self都指向同一个对象。若虚拟机在视图中运行良好，那个么您也可以使用虚拟机，因为最终两者都是相同的对象。