AngularJS，如何将一个变量绑定到其他两个绑定变量的串联？

我是 AngularJS 的新手，正在尝试构建一个 AngularJS 练习应用程序，其中用户将连接来自多个输入的 url，即协议、域、路径、param1、param2、param3...等。

该应用程序将创建一个指向该网址的链接：

<a>{{protocol}}://{{domain}}{{path}}?{{param1}}&{{param2}}&{{param3}}</a>

上面的网址使用了两次。一旦位于 href 属性以及实际文本上。现在我想做的是：

<a href="{{url}}">{{url}}</a>

但我不确定在哪里分配 url。 我在下面尝试过，它有效，但似乎不正确。

<a href='{{url = protocol+"://"+domain+path+"?"+param1+"&"+param2+"&"+param3}}'>{{url}}</a>

假如说url在应用程序中多次使用，哪里是最合适的分配位置url?

您不应该在视图（HTML）中分配作用域变量 - 它仅用于读取它们。

要从输入创建新变量，请向每个输入添加一个 ng-model，然后在控制器中定义一个方法，从它们创建 $scope 变量，例如

您的 HTML 表单：

<div ng-controller="MyCtrl">

    <input type="text" ng-model="urlParts.protocol">
    <input type="text" ng-model="urlParts.domain">
    <!-- etc -->
    <a ng-href="{{makeUrl()}}">{{makeUrl()}}</a>
</div>

JS:

function MyCtrl($scope) {
    $scope.urlParts = {};
    $scope.urlParts.protocol = ""; 
    $scope.urlParts.domain = ""; 
    // etc... 
    // These values will be updated when the user types in the input boxes

    $scope.makeUrl = function() {
      return $scope.urlParts.protocol + "://" + $scope.urlParts.domain + $scope.urlParts.path + "?" + $scope.urlParts.param1 + "&" + $scope.urlParts.param2 + "&" + $scope.urlParts.param3;
    }
}