$ watch入​​力からのデータを印刷

Question

私はAngularJSの新機能ですが、$http.getJSONを印刷する検索タブを開発する必要があります。

論理は、ng-modelに$watcherを付けてデータを印刷することです。

正しくしていますか？それをより良くするための他の勧告がありますか？ここで

は、私はコードを貼り付け怒鳴る：

discover.js

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

discover.controller('getDiscover', [ '$scope', 'img', 'search', function ($scope, img, search) { 

    var data = this; 

    $scope.$watch('searchStr', function (substring) { 
    if (substring && substring.length > 1) { 
     search.getJSON(substring).then(function (response) { 
     data.stories = response.stories; 
     data.tags = response.tags; 
     data.users = response.users; 
     }); 
    } 
    }); 
}]); 

_discover.htmlを

<div style="padding-top:50px;"> 
    <article> 
    <section> 
     {{my.stories}} 
     {{my.tags}} 
     {{my.users}} 
    </section> 
    </article> 
</div> 

EDIT

私が説明しようとしている実際の問題をもっと理解することができなかった。ここ

.state('discover', { 
    url: "/discover", 
    views: { 
     'header': { templateUrl: "app/Topbar/_topbarDiscover.html", controller: 'getDiscover', controllerAs: 'my' }, 
     'content': { templateUrl: "app/Discover/_discover.html", controller: 'getDiscover', controllerAs: 'my' }, 
     'footer': { templateUrl: "app/Navbar/_navbar.html", controller: 'NavbarController', controllerAs: 'my' } 
    } 
}); 

主な問題は、私は同じcontrollerを書くことは、私は2 ui-viewsに同じcontrollerを使用していたが、実際には最初のcontrollerがアクションを呼んでいたので、それがどのtopbar controller: getDiscoverた意味と理解されますデータがあった。

Answer 1

これに代わるものは、それがモデル$scope.searchStrの変化を監視するようあなたがここに$watchを使用することができ

$scope.print = {stories: '', tags: '', users: ''}; 

で印刷する必要があるもののように、オブジェクトリテラルを維持するために連想配列を使用することです。この関数は、単一の文字がモデルに入力されても呼び出されることに注意してください。代わりに、angularJS APIドキュメントからng-blurを見ることができます。

$scope.$watch('searchStr', function (substring) { 
    if (substring && substring.length > 1) { 
     search.getJSON(substring).then(function (response) { 
     //parse Json 
     var parsedData = JSON.parse(response.data); 

     $scope.print.stories = parsedData.stories; 
     $scope.print.tags = parsedData.tags; 
     $scope.print.users = parsedData.users; 
     }); 
    } 
}); 

$http

を使用してサービスは、$resourceresponse.dataの形態でペイロードを返します。サービスはJSONを返すので、ビューに印刷する前に解析する必要があります。

<div style="padding-top:50px;"> 
    <article> 
    <section> 
     {{print.stories}} 
     {{print.tags}} 
     {{print.users}} 
    </section> 
    </article> 
</div>