Angularjs 带附加组件的角度布线

我有一个小网站，我想与角。该网站包括3类内容： -一个列表，实际上是索引，“/” -唯一的书面内容，即“/r” -列表中元素的suv视图 我有这三种类型的视图，但在布线方面我遇到了问题。 我已经有了一个控制器，它可以处理工作对象，并通过数组中的数组键值对、标题、副标题、缩略图等为每个工作项创建列表，但是当我单击其中一个列表项时，它的子页面应该会出现。我想将它与默认的$index属性一起使用，这对我来说已经足够了。但是我可以使用我为列表制作的控制器吗，还是应该制作另一个控制器？ 为了提供帮助，这是我的app.js：

    (function(){
    var app = angular.module("portApp", ["ngRoute"]);
    app.config(function($routeProvider) {
        .when("/", { // default, basically the list-view
            controller: "",
            templateUrl: "/listView.html"
        });
        .when("/r", { // about section-s content
            controller: "",
            templateUrl: "/resumeView.html"
        });
        .when("/w/:wId", { // sub pages from the list view - $index
            controller: "???",
            templateUrl: "/itemView.html"
        });
        .otherwise({ // otherwise redirect to the listView
            redirectTo: "/"
        });
    });
    app.controller("PortController", function(){ // controller for the listView
        this.products = work;
    });
    var work = [
        {
            Title: "Carlsberg / Dreher",
            subTitle: "Sörösdoboz tervek ",
            Link: "sorok",
            Thumbnail: "img/portfolio08.png",
            Image: "img/sorokmont.png"
        },
        {
            Title: "Pepsi",
            subTitle: "Kristályvíz Promóció",
            Link: "pepsi",
            Thumbnail: "img/portfolio13.png",
            Image: "img/pepsimont.png"
        }    
    ]
})();

我该怎么完成这个

---

或者我应该使用listView中的项目链接属性，并将其与控制器一起发送到itemView吗？

要使用“工作”数组创建工厂，请执行以下操作：

app.factory('workFactory', function() {
  var scope = this;

  scope.work = [
        {
            Title: "Carlsberg / Dreher",
            subTitle: "Sörösdoboz tervek ",
            Link: "sorok",
            Thumbnail: "img/portfolio08.png",
            Image: "img/sorokmont.png"
        },
        {
            Title: "Pepsi",
            subTitle: "Kristályvíz Promóció",
            Link: "pepsi",
            Thumbnail: "img/portfolio13.png",
            Image: "img/pepsimont.png"
        }    
    ];

  return scope;
}

然后在控制器中注入并调用它

app.controller('myController', function($scope, workFactory, $routeParams) {
  $scope.work = workFactory.work;
  $scope.product = scope.work[$routeParams.wId];
});

---

工厂在你的应用程序中是相同的，所以当你在一个控制器中设置工厂属性时，它在另一个控制器中保持为真。这与只提供自身实例的其他服务类型不同。

您可以在controller中使用$location.path。我会将“work”存储在factory服务中，并从controller调用它，而不是将其作为全局变量。然后，在更改路由之前，您应该在factory服务中调用“setProduct”方法。为产品页面创建一个新的控制器，用于检查出厂服务中设置的产品，并将其加载到范围中。或者使用$routeParams加载整个“work”数组并使用$routeParams.wId访问所需产品的索引。谢谢@Rorschach120，但我是Angular的新手，所以我现在只是想让事情顺利进行：$所以我稍微修改了代码，现在在我的js文件中也有locationProvider，我组成了2个控制器：1个用于定义我的工作数组，我在其中迭代了列表视图，1个用于处理细节。我更改了work.Link值-从中删除了.html-，并希望将其传递给另一个控制器并仅获取相关数据。但是我该怎么做才能得到服务呢？我会加上它作为回答，因为我在这里没有空间了。啊，谢谢。只有一个问题我现在还不清楚。。在此之前，我只有一个简单的数组，它在控制器中用this.product=work行调用。但是现在如果我把示波器放进工厂，我怎么能为另一个控制器访问它呢？portApp.controller'mainController'，函数$scope{this.products=$scope.work；}；我只是在工厂里用scope这个词。它可能是var香蕉=这个；还香蕉；它只是用来归还工厂的物品。只需将工厂注入控制器，方法与上面相同。