将范围变量连接到angular指令表达式中的字符串

Question

我在角度ng-click指令中使用范围方法,如下所示:

<a ng-click="$navigate.go('#/path/obj.val1/obj.val2')">{{obj.val1}}, {{obj.val2}}</a>

这里的问题是obj.val1和obj.val2被解释为传递给表达式中方法的字符串的一部分.我需要将它们作为它们的变量进行评估......我不确定这里的正确方法是什么.

是否有一种角度方式将这些值连接到该字符串/表达式？

我只是"做错了"？

Answer 1

我已经创建了一个有效的CodePen示例来演示如何执行此操作.

相关HTML:

<section ng-app="app" ng-controller="MainCtrl">
  <a href="#" ng-click="doSomething('#/path/{{obj.val1}}/{{obj.val2}}')">Click Me</a><br>
  debug: {{debug.val}}
</section>

相关的javascript:

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.obj = {
    val1: 'hello',
    val2: 'world'
  };

  $scope.debug = {
    val: ''
  };

  $scope.doSomething = function(input) {
    $scope.debug.val = input;
  };
});

Answer 2

您可以使用连续值 +

<a ng-click="$navigate.go('#/path/' + obj.val1 + '/' + obj.val2)">{{obj.val1}}, {{obj.val2}}</a>

关于jsfiddle的简单示例

我确定您发布的代码是一个简化的示例,如果您的路径构建更复杂,我建议您提取一个可以构建您的URL的函数(或服务),以便您可以有效地编写单元测试.

Answer 3

目前还不清楚问题是什么以及您想要从您发布的代码中实现什么目标，但我会尝试一下。

一般来说，我建议在 ng-click 上调用一个函数，如下所示：

<a ng-click="navigateToPath()">click me</a>

obj.val1&obj.val2应该在控制器的 $scope 上可用，您不需要将它们从标记传递到函数中。

然后，在你的控制器中：

$scope.navigateToPath = function(){
   var path = '/somePath/' + $scope.obj.val1 + '/' + $scope.obj.val2; //dont need the '#'
   $location.path(path)       
}