Question

我正准备一个网站的移动页面。当访客打开链接时，如果他/她的设备是移动的，php会将他/她重定向到具有相同网址的移动页面。

有一些问题。像<paper-toolbar id="mainToolbar" class="tall" style$={{computedStyleHandler(color)}}> computedStyleHandler: function(color){ return 'background-color:' + color + ';' }和sitename.com/product-name-334这样的网址。他们检测到sitename.com/category_name_c和产品ID的页面感谢。但我不知道我怎么能用棱角分明呢？

我想听你的建议。

Answer 1

您应该尝试使用ui-Router的$ stateProvider。

StateProvider API Reference

首先，您需要在索引文件中引用ui-Router。

然后，您可以使用data-ui-sref属性为超链接指定状态。

       <li>
        <a data-ui-sref="product">

        </a>
    </li>

</ul>`

然后你需要为州分配一个网址，一个模板和一个控制器。

 angular.module('sspRouting', ['ui.router'])
.config(['$stateProvider', '$urlRouterProvider',
      function ($stateProvider, $urlRouterProvider) {
          $urlRouterProvider.otherwise('/');

          $stateProvider
              .state('product',
              {
                  url: "/productDetail/{productId}",
                  templateUrl: 'app/view/productTemplate.html',
                  controller: 'productController'        
              })
        )}]);

然后在控制器内部，您可以使用$ routeParams从URL获取id，然后使用该特定产品的数据构建您的html。

        .controller('productController', function($scope, $http, $routeParams, productService) {
            var productId = $routeParams.productId;
            // your code here.
//example $scope.productDetail = productService.getProductDetail(productId);
    });

AngularJS中没有斜线的路由

1 个答案: