2017-08-21 32 views
0

我试图将选定的js库包含到我使用select html标签的项目中。它使用简单的选择列表,但是当我尝试使用角度js ng-repeat填充列表时,它不工作。请帮我,我哪里出错了。下面是我的代码。选择的JS不能使用Angular JS重复

<html> 
 
<head> 
 
    <title></title> 
 
    <link rel="stylesheet" href="docsupport/style.css"> 
 
    <link rel="stylesheet" href="docsupport/prism.css"> 
 
    <link rel="stylesheet" href="chosen.css"> 
 
</head> 
 

 
<body ng-app="testapp" ng-controller = "testController"> 
 
    <select chosen class="chosen-select" ng-options = "cust.CustName for cust in customers"> 
 

 
    </select> 
 

 

 

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.js" type="text/javascript"></script> 
 
     <script src="chosen.jquery.js" type="text/javascript"></script> 
 
     <script src="docsupport/prism.js" type="text/javascript" charset="utf-8"></script> 
 
     <script src="docsupport/init.js" type="text/javascript" charset="utf-8"></script> 
 

 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"> </script> 
 

 
     <script type="text/javascript"> 
 
     var app = angular.module('testapp', []); 
 
     app.controller('testController',['$scope','$http', function($scope,$http)  
 
     { 
 
      $http.get("php/getCustomerList.php") 
 
      .then (function(response) 
 
      { 
 
       $scope.customers = response.data;    
 
      }); 
 
     }]); 
 
     </script> 
 
</body> 
 
</html>

+1

输入值,我没有看到你注入任何事情'chosen'。 –

+0

检查此https://www.youtube.com/watch?v=8ozyXwLzFYs – nmanikiran

回答

1

我认为你必须在你的select标签使用ng-modelng-options。 尝试像下面的代码:

<select chosen class="chosen-select" ng-model="mySelectBox" ng-options = "cust.CustName for cust in customers"> 

你可以在这里查看我跑步片段。我删除了你的API调用和手动

<html> 
 
<head> 
 
    <title></title> 
 
    <link rel="stylesheet" href="docsupport/style.css"> 
 
    <link rel="stylesheet" href="docsupport/prism.css"> 
 
    <link rel="stylesheet" href="chosen.css"> 
 
</head> 
 

 
<body ng-app="testapp" ng-controller = "testController"> 
 
    <select chosen class="chosen-select" ng-model="mySelect" ng-options = "cust.CustName for cust in customers"> 
 

 
    </select> 
 

 

 

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.js" type="text/javascript"></script> 
 
     <script src="chosen.jquery.js" type="text/javascript"></script> 
 
     <script src="docsupport/prism.js" type="text/javascript" charset="utf-8"></script> 
 
     <script src="docsupport/init.js" type="text/javascript" charset="utf-8"></script> 
 

 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"> </script> 
 

 
     <script type="text/javascript"> 
 
     var app = angular.module('testapp', []); 
 
     app.controller('testController',['$scope','$http', function($scope,$http)  
 
     { 
 
       $scope.customers = [{'CustName':'Angular'},{'CustName':'JavaScript'},{'CustName':'Java'}];    
 
     }]); 
 
     </script> 
 
</body> 
 
</html>