Question

我的代码中有类似的东西

<ul ng-model="services">
   <p ng-repeat="item in items"><b>{{ item.name }}</b> 
   </p>

我有3个项目：宝马，高尔夫和梅赛德斯我想要一个带有每个项目名称的网址，例如/ bmw或/ mercedes以及所有网址使用details.html来显示所选项目的详细信息。我想知道我该怎么做。

Answer 1

您可以编写像

这样的通用路线

.when('/car/:carId', {
  templateUrl: 'some/path/details.html',
  controller: 'someCtrl'
})

然后在控制器中，您可以使用$routeParams

获取:carId的值

Answer 2

您只需要对此进行编码：

<ul ng-model="services">
  <p ng-repeat="item in items"><a href="/items/{{item}}">{{ item.name }}</b> 
  </p>
</ul>

然后在app.js中捕获网址，如下所示：

.when('/item/:itemName', {
  templateUrl: 'some/path/itemDetail.html',
  controller: 'ItemCtrl'
})

然后完成，您只需要在控制器中获取项目名称

ItemCtrl.js：

App.controller('ItemCtrl', ['$scope', '$routeParams',
    function($scope, $routeParams) {
        $scope.itemName = $routeParams.itemName;
}]);

Answer 3

您可以在模块中定义路径，如下所示：

var myModule = angular.module('myModule', [])
    .config(['$routeProvider', '$httpProvider', '$locationProvider', '$mdThemingProvider',
        function ($routeProvider, $httpProvider, $locationProvider, $mdThemingProvider) {
            $routeProvider
                .when('/page1', {
                    templateUrl: "Views/Angular/Pages/page1.html",
                    contoller: "page1Ctrl"
                })
                .when('/page2', {
                    templateUrl: "Views/Angular/Pages/page2.html",
                    controller: "page2Ctrl"
                })
            .otherwise({ redirectTo: '/default' });

当路径更改为“page1”时，此模块将加载page1.html作为新视图。

您可以在以下元素中设置视图： <md-content ng-view=""></md-content>

使用angularjs的动态网址路由

3 个答案: