Question

我在使用<a href时遇到了困难，因此我尝试找到另一种解决方法。该计划是使用ng-click来调用url，然后使用url重新加载页面。

这是我的html：

<li class="item" ng-click="go_to()">
    <img src="img/ionic.png">
    <p>Beginners Guide</p>
</li>

打电话：

app.controller("listController", ['$scope', '$location', function ($scope, $location) {
    $scope.go_to = function () {
        alert("a"); //CALLED
        var url = "http://google.com";
        $location.url(url); //NOT LOADED
    }
}]);

最终目标是，我只希望我的应用在点击<li>时打开网址

非常感谢你的帮助

Answer 1

您可以使用

$window.location.href = 'http://google.com'

完整代码应该看起来像

    app.controller("listController", ['$scope', '$location', '$window', function($scope, $location, $window) {
    $scope.go_to = function() {
        alert("a"); //CALLED
        var url = "http://google.com";
        $window.location.href = url;
    };
}]);

Answer 2

一个对我有用的简单方法是：

<a href="...">
<li class="item" ng-click="go_to()">
    <img src="img/ionic.png">
    <p>Beginners Guide</p>
</li>
</a>

Answer 3

您可以使用$window.open(url, '_blank')

或

您可以查看this answer，其中我已经进行了此类更改，您可以从ui-router州本身重定向到其他页面。

您还可以通过添加参数external来自定义ui-router，它可以是true / false。

$stateProvider .state('external', { url: 'http://www.google.com', external: true })

然后在你的州＆amp;中配置$ stateChangeStart在那里处理重定向部分。

运行阻止

myapp.run(function($rootScope, $window) { $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) { if (toState.external) { event.preventDefault(); $window.open(toState.url, '_self'); } }); })

Working Plunkr

Answer 4

最好使用$ stateProvider，你还需要添加白名单插件访问外部资源。

像这样使用$ stateProvider

.config(function($stateProvider, $urlRouterProvider) {

        // Ionic uses AngularUI Router which uses the concept of states
        // Learn more here: https://github.com/angular-ui/ui-router
        // Set up the various states which the app can be in.
        // Each state's controller can be found in controllers.js
        $stateProvider

            // setup an abstract state for the tabs directive
            .state('tab', {
                url: '/tab',
                abstract: true,
                templateUrl: 'templates/tabs.html'
            })

            // Each tab has its own nav history stack:

            .state('tab.dash', {
                url: '/dash',
                views: {
                    'tab-dash': {
                        templateUrl: 'templates/tab-dash.html',
                        controller: 'indexController'
                    }
                }
            })

            .state('tab.chats', {
                url: '/chats',
                views: {
                    'tab-chats': {
                        templateUrl: 'templates/tab-chats.html',
                        controller: 'CenterListController'
                    }
                }
            })
            .state('tab.chat-detail', {
                url: '/chats/:centerId',
                views: {
                    'tab-chats': {
                        templateUrl: 'templates/chat-detail.html',
                        cache:true,
                        controller: 'CenterDetailController'
                    }
                }
            })

            .state('tab.manual-Location', {
                url: '/manualLocation',
                views: {
                    'tab-account': {
                        templateUrl: 'templates/tab-account.html',
                        controller: 'ManualLocationController'
                    }
                }
            })
            .state('tab.manual-Location-List', {
                url: '/manualLocationList/:locationID',
                views: {
                    'tab-account': {
                        templateUrl: 'templates/manualLocationList.html',
                        controller: 'ManualLocationListController'
                    }
                }
            })
            .state('tab.manual-Location-Detail', {
                url: '/manualLocationDetail/:centerId',
                views: {
                    'tab-account': {
                        templateUrl: 'templates/manual-Location-Detail.html',

                        controller: 'ManualLocationDetailController'
                    }
                }
            });

        // if none of the above states are matched, use this as the fallback
        $urlRouterProvider.otherwise('/tab/dash');

    });

Answer 5

$ location服务并非旨在导航并重新加载当前页面。它专为单页应用程序而设计。

https://docs.angularjs.org/guide/$location

$ location服务允许您仅更改URL;它不是允许您重新加载页面。当您需要更改URL和重新加载页面或导航到不同的页面，请使用较低的页面级别API，$ window.location.href。

如果您尝试导航到其他页面，请使用：

$window.location.href = "http://www.google.com";

如果您使用的是ui-router。您可以使用<a ui-sref=""作为导航到不同路线的方式。这实际上只是$state.go

的包装器

Answer 6

您可以使用以下代码解决此问题

$window.open("http://google.com", "_blank");

这将打开下一个标签中的网址

http://plnkr.co/edit/hfQ18sdHHzEgkF4vEYs5?p=preview

这是您的问题的可行解决方案之一

$scope.go_to = function() {
    alert("a"); //CALLED
    var url = "http://google.com";
    $window.open(url, "_blank");
};

Answer 7

终于找到了罪魁祸首:)）

因为我在我的index中评论了这个代码：

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

之后，我只需要使用基本的href

如何使用位置服务打开网址

7 个答案: