8

HTML ページに埋め込まれた JSON オブジェクトで Angular モデルを初期化したいと考えています。例：

<html>
  <body>
    <script type="text/javascript" charset="utf-8">
      var tags = [{"name": "some json"}];
    </script>
    <ul>
      <li ng-repeat="tag in tags">{{tag.name}}</li>
    </ul>
  </body>
</html>

でルックアップされているため、tagsフィールドを解決できません$scope。tags次のようにコントローラーのフィールドにアクセスしようとしました：

function TagList($scope, $rootScope) {
  $scope.tags = $rootScope.tags;
}

しかし、うまくいきません。

TagListHTML ページに直接インクルードし、JSON をこの関数に直接レンダリングする場合にのみ機能します。

tagsAngularコントローラーの別のjsファイルのフィールドにアクセスするにはどうすればよいですか?

4

1 に答える 1

11

少なくとも 2 つの方法があります。

  1. tagsスタンドアロンのスクリプト タグで配列を宣言します。この場合、tags変数はウィンドウ オブジェクトにバインドされます。$window をコントローラーに挿入して、ウィンドウにバインドされた変数にアクセスします。
  2. ディレクティブtags内で配列を宣言します。ng-init

両方のソリューションを表示:

HTML:

<body>

  <script type="text/javascript" charset="utf-8">
    var tags = [{"name": "some json"}];
  </script>

  <div ng-controller="AppController">
    tags: {{tags | json}}
    <ul>
      <li ng-repeat="tag in tags">{{tag.name}}</li>
    </ul>
  </div>  

  <div>
    <ul ng-init="tags = [{name: 'some json'}]">
      <li ng-repeat="tag in tags">{{tag.name}}</li>
    </ul>
  </div>

</body>

JS:

app.controller('AppController',
  [
    '$scope',
    '$window',
    function($scope, $window) {
      $scope.tags = $window.tags;
    }
  ]
);

プランク

ウィンドウオブジェクトを汚染しないことを強くお勧めします。

于 2013-03-07T15:46:51.263 に答える