響應數據不NG-重複

我使用angularJS一個示例應用程序的工作結合表。響應數據不NG-重複

我有返回JSON對象服務，我想一個表的響應綁定。

控制器 -

(function() { 
    var app = angular.module('searchApp', []); 
    app.config(function ($sceDelegateProvider) { 
     $sceDelegateProvider.resourceUrlWhitelist(['http://localhost:11838/SearchProfiles/get']); 
    }); 
    var controller = app.controller('searchController', ["$scope", "$http", function ($scope, $http) { 
     $scope.profileName = ""; 
     $http.get("http://localhost:11838/SearchProfiles/GetAllRuleSets") 
      .then(function (response) { 
       $scope.ruleSets = response.data; 
     }); 
     $scope.searchProfiles = function() { 
      $http.get("http://localhost:11838/SearchProfiles/GetProfiles?profileName=" + $scope.profileName 
       + "&ruleSetName=" + $scope.selectedRuleSet) 
      .then(function (response) { 
       $scope.showProfiles = true; 
       $scope.profiles = response.data; 
       console.log($scope.profiles); 
      }); 
     }; 
     $scope.clearForm = function() { 
      $scope.profileName = ""; 
      $scope.selectedRuleSet = ""; 
     }; 
    }]); 
})();

CSHTML -

@{ 
    ViewBag.Title = "Search Profiles"; 
} 
<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Search Profiles</title> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> 
    @Scripts.Render("~/Scripts/angular") 
    @Styles.Render("~/Content/css/scss") 
</head> 
<body ng-app="searchApp"> 
    <div ng-controller="searchController" id="content"> 
     <label>Profile Name: </label> 
     <input type="text" name="profileName" ng-model="profileName" /><br /> 
     <label>RuleSet Name: </label> 
     <select ng-model="selectedRuleSet" ng-options="x for x in ruleSets"></select><br /> 
     <button name="search" ng-click="searchProfiles()">Search</button> 
     <button name="clear" ng-click="clearForm()">Clear</button> 
    </div> 
    <div ng-controller="searchController" id="profilesDiv"> 
     <table> 
      <tr ng-repeat="x in profiles"> 
       <td>{{ x.ProfileName }}</td> 
       <td>{{ x.CreationDate }}</td> 
      </tr> 
     </table> 
    </div> 
</body>

我找回以下響應 -

[{"ProfileName":"Profile3","CreationDate":"1/9/2017"},{"ProfileName":"Profile4","CreationDate":"12/30/2016"}]

但即使設置$scope.profiles後我沒有看到UI上的表格。

我是相當新的角度，我失去了一些東西明顯。任何幫助表示讚賞。

來源

2017-01-10 user2769614

，這樣，它不會工作。在第一個'div'元素中移動表格代碼。 –

的問題是，要在一個範圍獲取數據（其中聲明納克控制器=「searchController」在div內容），然後試圖查看數據在另一個範圍（在div profilesDiv其中你再次聲明ng-controller =「searchController」）。

爲了解決您需要從profilesDiv刪除NG控制器=「searchController」並移動profilesDiv內容DIV中的問題。

像這樣：

<body ng-app="searchApp"> 
     <div ng-controller="searchController" id="content"> 
      <label>Profile Name: </label> 
      <input type="text" name="profileName" ng-model="profileName" /><br /> 
      <label>RuleSet Name: </label> 
      <select ng-model="selectedRuleSet" ng-options="x for x in ruleSets"></select><br /> 
      <button name="search" ng-click="searchProfiles()">Search</button> 
      <button name="clear" ng-click="clearForm()">Clear</button> 
      <div id="profilesDiv"> 
      <table> 
       <tr ng-repeat="x in profiles"> 
        <td>{{ x.ProfileName }}</td> 
        <td>{{ x.CreationDate }}</td> 
       </tr> 
      </table> 
     </div> 
     </div> 

    </body

您使用的是相同的控制器兩次

來源

2017-01-10 07:58:32

不，它不起作用。您需要在控制器'div'元素中移動'profilesDiv'。 –

@AmitKumarGhosh謝謝，錯過了div內容的結束標記。 –

響應數據不NG-重複

回答

相關問題