javascript - Angular中是否有相当于“blah”+变量+“blah”的东西？

Question

这实际上有效：

<div ng-include="'/partials/' + items.my_filename + '.html'"></div>

但即使它找到了文件，它仍然给我一个错误：

GET http://localhost:9000/partials/.html 404 (Not Found) 

我很高兴它有效，但有人知道如何摆脱错误吗？

编辑：它从远程数据库中提取变量，延迟会导致错误吗？

EDIT2：是的，这就是造成它的原因。我认为这是 Firebase 的问题。

Answer 1

利用ng-if

<div ng-if="items.my_filename" ng-include="'/partials/' + items.my_filename + '.html'"></div>

示例：使用 ng-if：http: //jsfiddle.net/TheSharpieOne/daFhp/1/ 注意只有一个调用，带有文件名（如果该文件在那里，它将起作用）。

示例：没有 ng-if： http: //jsfiddle.net/TheSharpieOne/daFhp/ 注意这两个调用，一个没有 var/文件名。一个带有文件名的文件（如果该文件在那里，它将起作用）。

我$timeout在示例中使用来模拟 AJAX 调用的延迟。

ng-if防止坏电话。

更新
AngularJS (1.2.0-rc3+) 的较新版本ng-if在与ng-include. 要解决此问题，您可以简单地将ng-include元素包装在带有ng-if.

<div ng-if="items.my_filename">
    <div ng-include="'/partials/' + items.my_filename + '.html'"></div>
</div>

Answer 2

使用这个事实ng-include，给定一个null论点，将什么也不做。

结果你可以走这条路

<div ng-include="partialPath"></div>

与，例如

app.controller('Ctrl', function ($scope, $http) {
  $scope.partialPath = null;

  $http.get(...).success(function (data) {
     $scope.partialPath = '/partials/' + data.my_filename + '.html';
  });
});

或者你也可以使用这样的过滤器（非常适合重复使用）

app.filter('partialize', function () {
  return function (name) {
    return name ? '/partials/' + name + '.html' : null;
  };
});

具有以下部分定义

<div ng-include="my_filename | partialize"></div>