Angularjs - 變量未找到

有Angular.js這個問題，我似乎無法修復。這裏是我的簡單html：Angularjs - 變量未找到

<html ng-app="myAngularapp"> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> 
    <script src="myangular.js"></script> 
    </head> 
    <body> 
    <div ng-controller="myAngularCtrl"> 
<form ng-submit="addingName()"> 
     <input type="text" ng-model="myAngular.newname" size="30" 
       placeholder="add new todo here"> 
     <input class="btn-primary" type="submit" value="add"> 
     </form> 
</div> 
    </body> 
    </html>

和myangular.js：

angular.module("myAngularapp",[]) 
    .controller("myAngularCtrl", function($scope){ 
     $scope.myNames = [ 
      {name:"aaa"}, 
      {name:"aaa"}, 
      {name:"aaa"} 
     ]; 

     $scope.addingName = function(){ 
      $scope.myNames.push({name:newname}); 
     } 
    });

當我按下提交按鈕，我得到了一個錯誤：

Error: Can't find variable: newname

出了什麼問題？

來源

2015-10-05 sooon

嗨，什麼是** myAngular **。你的意思是代表你的控制器嗎？ –

你從未宣佈過newname，取而代之的則是可被訪問的$scope

<input type="text" ng-model="myAngular.newname" size="30">

一個財產$scope.myAngular.newname，不newname在你的控制器。

$scope.myNames.push({name: $scope.myAngular.newname});

這是因爲角度存儲能夠通過在$scope的HTML被訪問的變量。這是一個可以在控制器內部訪問的對象，使其具有獨特性。

來源

2015-10-05 02:24:23

您可以在控制器訪問myAngular.newname：

$scope.myAngular.newname

或者另一種選擇是將參數添加到addingName：

$scope.addingName = function(newname){//ur code};

然後更改HTML：

ng-submit="addingName(myAngular.newname)"

來源

2015-10-05 04:40:01

在你html你綁定你的輸入到一個叫做的模型210 但是，當您將此值添加到數組myNames時，您正在使用變量newname。

您可以在視圖或控制器中更改變量名稱。這取決於你。

一個選項，以解決您的問題是：

<input type="text" ng-model="myAngular.newname" size="30" 
       placeholder="add new todo here">

來源

2015-10-05 04:56:08

可以提交表單

http://plnkr.co/edit/6P5LXuuTAfUfQS4RxmWG?p=preview

來源

2015-10-05 08:38:41

請在Stack Overflow上放置完整的代碼，並說明代碼的工作原理和方式。如果您粘貼的鏈接將來會停止工作，那麼您的答案就會丟失，而且不必轉到單獨的頁面也是非常有用的。而且，只是勺子餵食的答案從來沒有幫助任何人 - 你應該解釋你給的代碼是如何解決這個問題的。謝謝！ –

作爲後使用

this.myAngular.newname

用於獲取文本框的值最佳實踐：ViewModel應該非常清晰地定義。

始終使用Controller As語法並避免$ scope。

<form ng-submit="addingName()"> 
    <input type="text" ng-model="myAngular.newname" size="30" 
        placeholder="add new todo here"> 
    <input class="btn-primary" type="submit" value="add"> 
</form>

當您使用myAngular.newname，應在VM（在你的情況$scope）聲明。並通過NEWNAME的參數在addingName功能

所以，你的JS是：

angular.module("myAngularapp",[]) 
    .controller("myAngularCtrl", function($scope){ 
     $scope.myNames = [ 
      {name:"aaa"}, 
      {name:"aaa"}, 
      {name:"aaa"} 
     ]; 

     //or you may use without myAngular 
     //$scope.newname = ""; 
     //in this case you will have to use: ng-model="newname" 
     //      instead of ng-model="myAngular.newname" 
     $scope.myAngular = { 
      newname: "" 
     }; 

     $scope.addingName = addName; 

     //you can use addName function even to add names from JS itself also 
     function addName(name){ 
      $scope.myNames.push({name}); 
     } 
    });

和看法是：

<form ng-submit="addingName(myAngular.newname)"> 
    <input type="text" ng-model="myAngular.newname" size="30" 
        placeholder="add new todo here"> 
    <input class="btn-primary" type="submit" value="add"> 
</form>

PS：我不能添加評論，因此將所有最佳做法列爲單獨的答案。

來源

2015-10-27 11:27:46 Kulbhushan

Angularjs - 變量未找到

回答

相關問題