我無法在angularjs中正常工作

我嘗試這樣做，因爲這篇文章建議讓選擇選項在AngularJS中工作。 http://gurustop.net/blog/2014/01/28/common-problems-and-solutions-when-using-select-elements-with-angular-js-ng-options-initial-selection/我無法在angularjs中正常工作

然而，我已經搞砸了一些如何。下面是代碼 http://jsfiddle.net/8faa5/

這裏的fiddlerjs是HTML

<!DOCTYPE html> 
<html class="no-js" data-ng-app="TestModule"> 
<head> 
    <title></title> 
</head> 
<body data-ng-controller="TestController"> 

    <h3>Test Select</h3> 
    Current Value: {{ ourData.CurrentSelected}} <br> 

    <select ng-init="ourData._currVal = {Value: ourData.CurrentSelected}" 
      ng-change="ourData.CurrentSelected = ourData._currVal.Value" 
      ng-model="ourData._currVal" 
      ng-options="oneItem.Value as oneItem.Disp 
     for oneItem in ourData.StuffForDropDown track by oneItem.Value"></select> 

    <!-- Get Javascript --> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script> 
    <script src="js/data.js"></script> 
</body> 
</html>

這裏是JS/data.js

(function() { 
    "use strict"; 

    var smallData = { 
     StuffForDropDown: [ 
      { 
       Disp: "01-Prospect", 
       Value: 5 
      }, 
      { 
       Disp: "02-Constituet Issue", 
       Value: 10 
      } 
     ], 
     CurrentSelected: "10" 
    }; 

    var myModule = angular.module("TestModule", ['ui.mask']); 

    myModule.controller("TestController", ["$scope", 
     function ($scope){ 
      $scope.ourData = smallData; 
     } 
    ]); 

})();

來源

2014-06-28 RebelATX

哪裏是'_currVal'模型定義 –

首先，你的jsfiddle被搞砸了。你已經定義了兩次angularjs，一次在jsfiddle選項中，第二次在代碼中。你也過分複雜的代碼。我簡單地重寫了你在這個jsfiddle中工作的代碼。

<div data-ng-app="TestModule"> 
    <div data-ng-controller="TestController"> 
     <h3>Test Select</h3> 
Current Value: {{ ourData._currval}} 
     <br> 
     <select ng-init="ourData._currVal = {Value: ourData.CurrentSelected}" 


     ng-model="ourData._currval" ng-options="oneItem.Value as oneItem.Disp 
     for oneItem in ourData.StuffForDropDown"></select> 

    </div> 
</div> 


(function() { 
    "use strict"; 

    var smallData = { 
     StuffForDropDown: [{ 
      Disp: "01-Prospect", 
      Value: 5 
     }, { 
      Disp: "02-Constituet Issue", 
      Value: 10 
     }], 
     CurrentSelected: "10" 

    }; 

    var myModule = angular.module("TestModule", []); 

    myModule.controller("TestController", ["$scope", 

    function ($scope) { 
     $scope.ourData = smallData; 
    }]); 

})();

**編輯： OK，我已經根據INT評論你的新要求修訂我的代碼。代碼去如下（new plunker）

<div data-ng-app="TestModule"> 
    <div data-ng-controller="TestController"> 
     <h3>Test Select</h3> 
Current Value: {{ currentItem.Value}} 
     <br> 
     <select ng-model="currentItem" ng-options="u as u.Disp for u in items track by u.Value"></select> 
    </div> 
</div> 

(function() { 
    "use strict"; 

    var myModule = angular.module("TestModule", []); 

    var ctrl = function ($scope) { 
     $scope.items = [{ 
      Disp: "01-Prospect", 
      Value: 5 
     }, { 
      Disp: "02-Constituet Issue", 
      Value: 10 
     }]; 

     $scope.currentItem = $scope.items[1]; 
    }; 

    myModule.controller("TestController", ctrl) 

})();

來源

2014-06-28 05:05:31 zszep

太謝謝你了！您的代碼修復極大地改進了小提琴。我試圖使其在「02-Constituet問題」被預先選擇並且當前值顯示爲10的地方。但是，當頁面第一次加載時，這不會發生，並且兩個區域都是空白的。 – RebelATX

我已經編輯了關於您的新請求的答案。請參閱已編輯的答案和新的搜索引擎：http://jsfiddle.net/zeljko/8faa5/22/ – zszep

我無法在angularjs中正常工作

回答

相關問題