Добавление переменной JS в каталог AngularJS?

Question

Добавление переменной JS в каталог AngularJS?

0

Я не могу заставить следующий код работать:

<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. -->

Благодарю.

user6336941 15 май 2016, в 15:13

Источник

0

stackoverflow.com/questions/19383725/...
Steffen 15 май 2016, в 12:22
0

Пожалуйста, удалите фигурные скобки из атрибута ng-include
Steffen 15 май 2016, в 13:04
0

используйте это в html: <div ng-app="myapp" ng-controller="MainCtrl" ng-include="'content/{{topic}}.html'"></div> ИЛИ <div ng-app="myapp" ng-controller="MainCtrl" ng-include="'content/' + topic + '.html'"></div>
bob 15 май 2016, в 13:04
0

Извините, но ни один из них не работает для меня.
user6336941 15 май 2016, в 13:11
0

Попробуйте это: jsfiddle.net/ursujuge/1 В сетевой консоли вашего браузера вы можете увидеть, что он пытается загрузить Dynamics.html.
Steffen 15 май 2016, в 13:29
0

Чтобы дать немного объяснения. Значение большинства угловых директив (например, ng-include) оценивается как javascript в контексте $ scope. Вот почему ваша переменная должна быть объявлена в текущей области видимости $. Двойные фигурные скобки приведут к ошибке, так как это неверный синтаксис js. Другие директивы, такие как ng-href, допускают строковый синтаксис, такой как <a ng-href="content/{{topic}}.html"> который часто приводит к путанице.
Steffen 15 май 2016, в 13:41
0

Большое спасибо @Steffen, после хорошего ночного сна я получил его на работу. Это действительно открыло мне глаза на то, как работает AngularJS. Еще раз спасибо.
user6336941 15 май 2016, в 23:35

Показать ещё 5 комментариев

Теги:

3 ответа

0

Попробуйте сделать следующее:

<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';
  }
}

Wcan 15 май 2016, в 11:36

0

попробуй это:

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

В angularjs variable are access scope variable are access в HTML, используя double curly brace notation {{ }}.

p2. 15 май 2016, в 10:51

0

Извините, это не работает для меня.
user6336941 15 май 2016, в 12:43
0

тема определена в вашем контроллере ?? если нет, попробуйте $scope.topic = topic ; в вашем контроллере.
bob 15 май 2016, в 12:46
0

Нет, я пытаюсь понять, как это сделать сейчас, поскольку я новичок в AngularJS. Я опубликую обновление, если не смогу заставить его работать.
user6336941 15 май 2016, в 12:48
0

попробуйте $scope.topic = topic ; ИЛИ $scope.topic = $window.topic; в вашем контроллере.
bob 15 май 2016, в 12:49
0

Правильный синтаксис фигурных скобок был бы <a ng-href="content/{{topic}}.html"> но, насколько я знаю, для ng-include требуется выражение javascript, используемое в коде вопроса. Более вероятно, что тема не является переменной области как @ p2. упоминается.
Steffen 15 май 2016, в 12:51

Показать ещё 3 комментария

Ещё вопросы

Пожалуйста, удалите фигурные скобки из атрибута ng-include
используйте это в html: <div ng-app="myapp" ng-controller="MainCtrl" ng-include="'content/{{topic}}.html'"></div> ИЛИ <div ng-app="myapp" ng-controller="MainCtrl" ng-include="'content/' + topic + '.html'"></div>
Извините, но ни один из них не работает для меня.
Попробуйте это: jsfiddle.net/ursujuge/1 В сетевой консоли вашего браузера вы можете увидеть, что он пытается загрузить Dynamics.html.
Чтобы дать немного объяснения. Значение большинства угловых директив (например, ng-include) оценивается как javascript в контексте $ scope. Вот почему ваша переменная должна быть объявлена в текущей области видимости $. Двойные фигурные скобки приведут к ошибке, так как это неверный синтаксис js. Другие директивы, такие как ng-href, допускают строковый синтаксис, такой как <a ng-href="content/{{topic}}.html"> который часто приводит к путанице.
Большое спасибо @Steffen, после хорошего ночного сна я получил его на работу. Это действительно открыло мне глаза на то, как работает AngularJS. Еще раз спасибо.
Извините, это не работает для меня.
тема определена в вашем контроллере ?? если нет, попробуйте $scope.topic = topic ; в вашем контроллере.
Нет, я пытаюсь понять, как это сделать сейчас, поскольку я новичок в AngularJS. Я опубликую обновление, если не смогу заставить его работать.
попробуйте $scope.topic = topic ; ИЛИ $scope.topic = $window.topic; в вашем контроллере.
Правильный синтаксис фигурных скобок был бы <a ng-href="content/{{topic}}.html"> но, насколько я знаю, для ng-include требуется выражение javascript, используемое в коде вопроса. Более вероятно, что тема не является переменной области как @ p2. упоминается.

user6336941 · Accepted Answer · 2016-05-15T22-20-00.000Z

На основе 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! -->

Большое спасибо всем за их ответы. :)