數據和指令（結構）

你對大Angularjs應用結構我使用這個風格指南以下：數據和指令（結構）

https://github.com/johnpapa/angular-styleguide

我開發了一個itemManager（項目管理器控制器），其中有兩個嵌套的指令（ 搜索選項和搜索結果）。

項目經理
- 搜索選項（現在並不重要）
- 搜索結果

的項目經理模板將顯示搜索選項和搜索結果s（使用迭代器）。

搜索結果指令控制器具有顯示項目所需的所有信息。

我的問題是，我不完全知道在哪裏存儲我將顯示的項目數組的信息。

搜索選項將觸發對REST服務的AJAX調用，該服務將返回包含我要顯示的所有搜索結果信息的JSON。問題是我不知道應該在哪裏存儲包含項目信息的數組。

我認爲，在項目經理的標記應該是這樣的：

<search-result ng-repeat="//iterator"><search-result>

但在項目經理，我沒有進入搜索結果的變量（它們是搜索結果中指令範圍）。

然後，如果我將該變量存儲在search-result指令中，我應該在指令模板內進行迭代，我認爲這不正確。任何人都可以給我建議，這應該如何結構？

來源

2015-04-14 jeffarese

一個絕妙的解決辦法是將存儲在服務中搜索結果並且不依賴於範圍之間的原型繼承。看看這個：

HTML：

<div ng-app="app"> 

    <div ng-controller="itemController"> 
     <search-options></search-options> 
     <search-result ng-repeat="item in items" item="item"></search-result> 
    </div> 

</div>

的JavaScript：

var app = angular.module('app', []); 

app.service('searchResultsService', function() { 
    var myData = ['a', 'b', 'c']; 
    return { 
     get: function() { 
      return myData; 
     }, 
     set: function(data) {myData = data;} 
    }; 
}).controller('itemController', function($scope, searchResultsService) { 
    $scope.searchResultsService = searchResultsService; 
    $scope.items = []; 
    $scope.$watch('searchResultsService.get()', function(newVal) { 
     $scope.items = newVal; 
    }); 
}).directive('searchResult', function() { 
    return { 
     scope: { 
      item: '=' 
     }, 
     restrict: 'E', 
     template: '<p>{{item}}</p>' 
    }; 
}).directive('searchOptions', function(searchResultsService) { 
    return { 
     scope: {}, 
     restrict: 'E', 
     template: '<button ng-click="search()">Search</button>', 
     link: function link(scope, element, attrs) { 
      scope.search = function() { 
       searchResultsService.set(['d', 'e', 'f']); 
      }; 
     } 
    }; 
});

工作小提琴這裏：https://jsfiddle.net/ben1729/x551pmz8/3/

來源

2015-04-14 10:34:43 bm1729

謝謝！添加項目：'='範圍定義是我所需要的，我認爲;） – jeffarese

如果您喜歡答案，歡迎隨時upvote或接受:) – bm1729

-1

您可以安全地存儲在itemManager控制器的數據和指令裏面它仍然能夠訪問它的指令已範圍與父母控制器擴展

來源

2015-04-14 09:29:50 Kushal

那麼我應該通過的結果，項目內部範圍$父存取權限。指示？ – jeffarese

您仍然可以直接訪問$ scope。你在控制器內使用的任何密鑰 – Kushal

如果你看到我鏈接的styleguide，你會看到我使用控制器作爲語法，所以我不使用$ scope。 – jeffarese

數據和指令（結構）

回答

相關問題