AngularJS 在 div 中使用 ng-click答案

【问题标题】：AngularJS using ng-click inside a divAngularJS 在 div 中使用 ng-click
【发布时间】：2015-05-19 02:18:11
【问题描述】：

我无法让 ng-click 工作，我试图在 div 中将 url 传递给它，所以当用户点击它时会转到下一页，但是当我点击 div 时，我可以看到它获得了正确的链接，但不是转到下一页，而是返回主页。

<div ng-repeat="contatosCliente in contatos" class="conteudo" type="item-link" ng-click="urlcontato('#/app/contatos/' + contatosCliente.contatos_id)">
                     {{contatosCliente.nome}}
                    <i class="ion-ios-arrow-right" style="border: none; padding-right: 11px"></i>

                </div>

还有我的控制器：

 $scope.urlcontato = function ( path ) {
            $location.path( path );
        };

【问题讨论】：

是的，我 100% 确定 @bioball

标签： javascript html angularjs model-view-controller ionic-framework

【解决方案1】：

$location.path 应该只用一个正斜杠调用，而不是那个哈希。

https://docs.angularjs.org/api/ng/service/$location

<div ng-repeat="contatosCliente in contatos" class="conteudo" type="item-link" ng-click="urlcontato('/app/contatos/' + contatosCliente.contatos_id)">

您应该检查以确保您的视图已绑定到您的控制器。在您的函数中添加一些日志记录，或使用调试器语句，以确保正在调用 urlcontato。

【讨论】：

【解决方案2】：

首先，路径应始终以正斜杠 (/) 开头，否则会自动附加。删除#，它应该可以工作

<div ng-repeat="contatosCliente in contatos" class="conteudo" type="item-link" ng-click="urlcontato('/app/contatos/' + contatosCliente.contatos_id)">
                 {{contatosCliente.nome}}
                <i class="ion-ios-arrow-right" style="border: none; padding-right: 11px"></i>

            </div>

【讨论】：

【解决方案3】：

由于 ionic 框架使用ui-router 进行路由，你应该这样做：

$scope.urlcontato = function ( state ) {    
    $state.go(state);
}

当然，您必须在控制器（或指令）中注入 $state 服务。

对于您的 html 代码中的默认链接，您应该使用

<a ui-sref="yourstate">Linktitle</a>

更多信息请见this Navigation and Routing Article

【讨论】：