Question

....           

.state('books', {
            url: '/book/chapter/:chap',
            templateUrl: "views/chapter.html",
            params: { chap: .........}
        })

嗨！我在特定的控制器中有一个变量，我想将它的值传递给路由的参数。最后我想更改该变量的值，以便我可以使用相同的路径创建新的URL。

我正在使用ui-router，你可能已经注意到了。

我也很好奇你将如何解决以下问题：基本上我想打开一本书的特定章节，让我们说第5章。然后我想在页面左侧显示每个剩余章节的链接，这就是我想要改变变量值的原因。你会如何使用ng-repeat解决这个问题？我正在考虑使用getArticle（如下所示）获取章节编号，然后用ng-repeat重复其余的章节？想法？

angular
    .module('BookLibrary')
    .controller("ChapterController", ["$scope","stateParams", "ChapterControllerService", function($scope, $stateParams, ChapterControllerService){

        $scope.chapterList = ChapterControllerService.chapters;
        $scope.getArticle = chapterList[0].chapter;

    }]);

chapterList看起来像这样：

chapterList = [
        { 
            chapter: "1",
            content: "Chapter 1 goes here"
        },
        {
            chapter: "2",
            content: "Chapter 2 goes here"
        },
        {
            chapter: "3",
            content: "Chapter 3 goes here"
        }
    ];

Answer 1

这里有多个问题，所以从状态参数开始。在状态参数中，您可以在类似的状态下声明参数的默认值。

.state('books', {
        url: '/book/chapter/:chap',
        templateUrl: "views/chapter.html",
        params: { chap: null}
    })

这会将值默认为null。也许你总是希望默认为第1章？如果是这种情况，您可以使用params: {chap: '1'}（因为您使用的是字符串）。要将值传递给状态，有多种方法可以执行此操作。假设您正在使用ui-sref，您可以在链接中直接处理参数值。

ui-sref="books({ chap: 3 })"

但是，您希望使用ng-repeat获得来自对象的链接列表。所以你可以做这样的事情

<ul>     
   <li ng-repeat="chapter in chapterList">
      <a ui-sref="books({chap: chapter.chapter})">{{chapter.chapter}}</a>
   </li>
</ul>

你已经在控制器中包含了$ stateParams，所以你只需要从中获取参数

angular
.module('BookLibrary')
.controller("ChapterController", ["$scope","$stateParams", 
"ChapterControllerService", function($scope, $stateParams, 
ChapterControllerService){

    $scope.currentChapter = $stateParams.chap;

    $scope.chapterList = ChapterControllerService.chapters;
    $scope.getArticle = chapterList[0].chapter;

}]);

将变量从控制器传递到路由参数

1 个答案: