向AngularJS目录添加JS变量

Adding a JS Variable to a AngularJS Directory?

本文关键字：JS 变量 添加 AngularJS      更新时间：2023-09-26

我似乎无法让以下代码工作：

<script>alert(topic);</script> <!-- Outputs: "dynamics" -->
<div ng-include="'content/' + topic + '.html'"></div> <!-- Does not work. -->

我已经推断出变量是问题所在，因为以下代码确实有效：

<div ng-include="'content/' + 'dynamics' + '.html'"></div> <!-- Works. -->

有人知道我该怎么做吗？

更新：

按照Steffen的链接，我写了以下代码，但仍然没有运气：

<script>
    alert(topic); // Outputs "dynamics"
    var app = angular.module('myapp', []);
    app.controller('MainCtrl', ['$scope', '$window', function ($scope, $window) {
        $scope.topic = $window.topic;
    }]);
</script>
<div ng-app="myapp" ng-controller="MainCtrl" ng-include="'content/' + 
    topic + '.html'"></div>  <!-- Does not work. -->

谢谢。

基于Steffen的jsfiddle，以下是我如何将JavaScript变量传递给AngularJS并将其用于定义目录：

<script>
    // Create module.
    var app = angular.module('app', []);
    // Add controller to module.
    app.controller('MainCtrl', ['$scope', '$window', function ($scope, $window) {
        $scope.topic = $window.topic;
        console.log($scope.topic);
    }]);
</script>
<div ng-app="app" ng-controller="MainCtrl" ng-include="'content/' + 
    topic + '.html'"></div> <!-- Works! -->

非常感谢大家的回答。：）

试试这个：

<div ng-include="'content/{{topic}}.html'"></div>

在angularjs中，使用double curly brace notation {{ }}在HTML中确定variable are access的范围。

尝试如下：

<ng-include src="topic"> </ng-include>

确保您已经定义了$scope.topic = "whateveryouwant"；

-----------或----------------

你可以这样做：

<ng-include src="getTopic()"></ng-include>

控制器：

function AppCtrl ($scope) {
  $scope.getTopic= function () {
      return 'partials/whatever.html';
  }
}
相关文章：