動態資源Angularjs

Question

我有一個搜索表單的指令。這會爲您提供一個帶有<form>標籤的模板，自動發送的消息（如「未找到結果」）和可選的建議消息，如「您可以按名稱或ID搜索」。

我的問題是，我想重新利用這個指令，例如，搜索書籍，作者或用戶在我的應用程序的不同頁面。我爲他們提供了資源（使用ngResource），所以我想爲我的指令動態地傳遞這些資源，但我不知道如何。我的代碼是在這裏：

angular 
    .module('my-app') 
    .directive('searchForm', searchForm) 
    .controller('searchFormController', searchFormController); 

function searchForm() { 
    return { 
     restrict: 'E', 
     scope: { 
      info: '@' 
     }, 
     controller: 'searchFormController', 
     templateUrl: 'templates/directives/search-form.html' 
    }; 
} 

function searchFormController($scope, maybe_dynamic_resource_here) { 
    $scope.results = []; 

    $scope.searchSubmit = function(form){ 
     // do the search here calling to the dynamic resource 
    }; 
} 

我的模板：

<form name="searchform" ng-submit="searchSubmit(searchform)" novalidate> 

<div class="wrapper-form center-block well"> 
    <div class="input-group"> 
     <input type="search" ng-model="search" name="search" class="form-control" required> 
     <span class="input-group-btn"> 
      <button class="btn btn-default" type="submit">Search</button> 
     </span> 
    </div> 
</div> 

<!-- mensajes --> 
<div class="msg-info" ng-show="info && !searchform.$submitted"> 
    <i class="fa fa-question-circle"></i> {{info}} 
</div> 

<div class="msg-info" ng-show="searchform.$submitted && !results.length"> 
    <i class="fa fa-exclamation-triangle"></i> No results found. 
</div> 
<!-- /mensajes --> 

<card-of-results ng-repeat="result in results" /> 

</form> 

而且我用我的指令，如：

<search-form 
    info="You can search by name or id." 
/> 

也許我是一個錯誤的概念，所有因爲我是新用角度，但理想對我來說這就是所謂的指令是這樣的：

<search-form 
    info="You can search by name or id." 
    resource="Books" <-- this is how I call the dynamic resource 
/> 

如果有更好的方法來做到這一點，所有幫助它非常感謝。

謝謝！

Answer 1

我明白想你想才達到。我會盡力爲我可能會[應用荷

首先我會給檢索算法工廠的解決方案。

.factory('SearchAPI', function ($resource) { 
    return { 
     search: function() { 
      return $resource('search/:path/:id', {}, { 
       books: { 
        method: 'GET', 
        params: { path: 'books' } 
       }, 
       authors: { 
        method: 'GET', 
        params: { path: 'authors' } 
       }, 
       users: { 
        method: 'GET', 
        params: { path: 'users' } 
       } 
      }) 
     } 
    } 
}); 

現在用在我的控制器調用看起來像

類型將是本書，作者，用戶

$scope.searchSubmit = function(type){ 
     switch(type){ 
     case 'books' : 
     SearchAPI.search().books(function(data){ 

     }); 
     break; 
     case 'authors' : 
      ...... 
    }; 
} 

以上簡單

.factory('SearchAPI', function ($resource) { 
     return $resource('search/:path/:id', {}, { 
       get: { 
        method: 'GET', 
        params: { path: '@path' } 
       }, 
     }); 

}); 

然後喲您的電話將是

$scope.searchSubmit = function(type){ 
     SearchAPI.get({path : type}).then(function(data){ 

     }); 
}