2

我有一个 index.html 文件，我将其用作带有页眉、ngview 指令和页脚的布局/模板。我在 ngview 中渲染的视图上成功使用了“resolve”属性以在异步调用完成后显示数据，但我试图将主 index.html 文件中的标题中的导航栏链接到另一个控制器填充有从异步调用返回的值。我似乎有两个问题。

  1. 为什么我工厂的数据不能“绑定”到 ngrepeat，这样当数据可用时，它会更新视图。
  2. 如何对 index.html 文件本身进行解析？我认为在“/”的路径上解析需要在渲染页面之前加载解析中的所有数据，但我想这只是针对 ngview 组件中的任何内容，而不是整个页面。

index.html（缩写）

<html ng-app="app">
<body>
 <nav class="navbar navbar-default header-navbar" role="navigation">
        <ul class="nav navbar-nav" data-ng-controller="NavController">
            <li class="active"><a href="#">Home</a></li>
            <li ng-repeat="brand in brands">
                <a href="#/brand/{{ brand.slug }}">{{brand.name}}</a>
            </li>
        </ul>
 </nav>
 <div ng-view></div>
</body>
</html>

app.js（缩写）

var app = angular.module('app',['MockDataService','ngSanitize']).
    config(['$routeProvider',
        function($routeProvider){
            $routeProvider
                .when('/',
                {
                    controller: 'SiteController',
                    templateUrl: 'partials/home.html',
                    resolve:{
                        'Brands':function(BrandFactory){
                            return BrandFactory.promise;
                        }
                    }
                })
...
shop.controller('SiteController',SiteController)
    .controller('NavController',NavController);

控制器

var SiteController = function ($scope, SiteFactory, BrandFactory){
    $scope.settings = SiteFactory.settings;
    $scope.brands = BrandFactory.getBrands();
    console.log($scope);
}
var NavController = function($scope, BrandFactory, $location)
{
    $scope.brands = BrandFactory.getBrands();
    console.log($scope);
}

服务.js

var MockDataService = angular.module('MockDataService',[])
    .factory('BrandFactory',function($http){
        var factory = {};
        var brands = {};
        var promise = $http.get('/data/brands.json')
            .success(function(data){
                brands = data;
            });

        factory.getBrands = function(){
            return brands;
        };
        factory.getBrandBySlug = function(slug){
            for(var i=0; i< brands.length; i++)
            {
                if(brands[i].slug === slug) return brands[i];
            }
        };

        factory.promise = promise;

        return factory;
    })
4

1 回答 1

0

这对我有用：将变量从服务/工厂绑定到控制器

在 egghead.io 上观看视频也有很大帮助（http://www.egghead.io/lessons）

于 2013-09-05T23:02:58.583 回答