【问题标题】:Ionic + Angular ui-sref not generating hrefIonic + Angular ui-sref 不生成href
【发布时间】:2016-05-12 12:18:50
【问题描述】:

我正在处理在 url 中传递参数。据我所知,一切设置正确,可以使用 vm.all 属性设置 baseFilter url 参数,但每次单击链接时都没有任何反应。我还检查了生成的 html,我看到了 ui-sref 而不是 href 标记。任何帮助表示赞赏

router.js

(function () {
    'use strict';
    angular.module('app').config(routing);
    /* @ngInject */
    function routing($stateProvider, $urlRouterProvider) {
        $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'home/home.html',
            controller: 'HomeContentController as vm'
    })

    .state('eventsList', {
        url: '/eventsList/:baseFilter',
        templateUrl: 'events-list/events-list.html',
        controller: 'EventsListController as vm'
    });
    $urlRouterProvider.otherwise('/home');
}
})();

这是我 home.html 中的 a 标签

   <a class="item" ui-sref="eventsList({baseFilter: vm.all})">

HomeController.js

(function () {
    'use strict';

    angular.module('app').controller('HomeContentController', HomeContentController);
/* @ngInject */
function HomeContentController($scope, $log, $ionicSideMenuDelegate, $ionicPopup, $state, rxEventsService, rxRequests, $cordovaGeolocation) {

    // Assign variable `vm` to `this` to reflect that this is a view-model.
    var vm = this;
    vm.all = "all";

        // Bindable Properties
        vm.promptUnavailable = promptUnavailable;

        // Controller Initialization
        function init() {
            console.log('init HomeContentController');
        }

        init();

        // Bindable Events
        function promptUnavailable(feature) {
            $ionicPopup.alert({
                title: 'Unavailable Feature',
                template: feature + ' is unavailable in this Alpha release'
            });
        }
    }
})();

【问题讨论】:

  • 删除href 属性。您的&lt;a&gt; 标签在哪个控制器范围内,即在该上下文中vm 是什么?
  • @Phil 我没有意识到我把 href 留在那里了。如果我手动指定完整的 url,我正在测试路由是否真的有效。范围是 HomeContentController 作为 vm
  • 你能提供你的HomeContentController的代码吗?

标签: javascript html angularjs href ui-sref


【解决方案1】:

如果您设置了正确的 vm.all 值,您的代码应该可以正常工作。

angular
.module('app', ['ui.router'])
.config(function ($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: 'home.html',
      controller: 'HomeContentController as vm'
    })
    .state('eventsList', {
      url: '/eventsList/:baseFilter',
      templateUrl: 'events-list.html',
      controller: 'EventsListController as vm'
    });

  $urlRouterProvider.otherwise('/home');
})
.controller('HomeContentController', function () {
  var vm = this;
  vm.all = 1;

})
.controller('EventsListController', function ($stateParams) {
  var vm = this;
  console.log($stateParams);
});

我使用您的代码创建了一个 JSBin,它运行良好。如果您在控制台日志中看到记录的值,则它的正确值为 $stateParamshttps://jsbin.com/qebimeh/1/edit?html,js,console,output

【讨论】:

  • 我不知道为什么,但昨晚这对我的生活不起作用。今天早上它像手表一样工作......我生命中的三个小时已经过去了。非常感谢您的帮助
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-04-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多