javascript - 应用程序加载后的 ng-include

标签 javascript angularjs

我目前有一个使用 Handlebars 来创建初始 HTML 页面的服务器。在此页面中,我希望有一个 ng-include 来更新客户端上的页面。

但是,每当我的应用程序运行时,它都会加载页面,因此 data-ng-include="template.url" 像平常一样加载 template.url。无论如何,ng-include 在我的应用程序加载后加载这些数据吗?

这是一个plunker 。看看index.html里面的代码!

最佳答案

你可以使用

ng-if指令

只需检查它的初始加载,它会让你的生活变得轻松

<ANY ng-if="expression">

 //your code goes here

</ANY>

比如

<ANY ng-if="false">

// code will not execute 

</ANY>

希望这对你有帮助

在你的代码上

<body>
<div data-ng-controller="ctrl">
  <div data-ng-include="template.url" ng-if="false">

    Here is some stuff that I wish to remain until I press the button below.
  </div>
  <button type="button" data-ng-click="second()">Press me!</button>
</div>

根据您的答案,您应该在 .js 文件中使用您的条件,这是您修改后的代码

 angular.module('myApp', [])
  .controller('ctrl', ['$scope', function ($scope) {

$scope.templates =
  [ { name: 'first.html', url: 'first.html'},
    { name: 'second.html', url: 'second.html'} ];

    if (false){
      $scope.template = $scope.templates[0];
    }


$scope.second = function () {
  $scope.template = $scope.templates[1];
};

$scope.first = function () {
  $scope.template = $scope.templates[0];
};

 }]);

关于javascript - 应用程序加载后的 ng-include,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32940256/

相关文章:

javascript - 使用 Webpack 将 src 文件夹结构维护到 dist 文件夹中?

javascript - React + Redux - 在表单组件中处理 CRUD 的最佳方式是什么?

javascript - Jquery 执行点击 <img>

javascript - 为什么 Mocha 测试没有运行? - Node .js

javascript - 控制台中的图像 ng-repeat .error 问题

保存历史记录的javascript

javascript - AngularJs 错误 - 未捕获错误 : [$injector:unpr]

javascript - 从嵌入的 HTML 访问组件 Controller

angularjs - Angular 指令只重复最后一个元素

javascript - 在 for 循环 JavaScript 中创建一个数组