- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
当我在各种浏览器或使用节点的本地主机上运行时,我无法在我的 Angular 应用程序的 ng-view 中呈现模板。控制台没有抛出任何错误。我已经阅读了我可以在网上找到的关于这个问题的所有内容,但没有一个能解决我的问题。我正在使用带有 El Capitan OS 的 macbook pro。我想知道在过去的一年里,作为一名初学者编码员,我是否通过 sudo 安装东西并在没有虚拟环境的情况下运行东西,对我的计算机做了一些有趣的事情。或者可能这里有一些愚蠢的明显错误,我在尝试我能想到的每一种排列时都忽略了。
这是我的 index.html 文件:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My App</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body ng-app="OIApp">
<nav id="mainnav" class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">
<h1>My App</h1>
</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li class="active">
<a href="#/">Home</a>
</li>
<li>
<a href="#/about">About</a>
</li>
<li>
<a href="#/blog">Blog</a>
</li>
<li>
<a href="#/products">Products</a>
</li>
</ul>
</div>
</nav>
<div ng-controller="OIController1">
<div ng-view>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-route.min.js"></script>
<script src="OIController.js"></script>
<script src="OIApp.js"></script>
<script src="config.js"></script>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
App.js 看起来像这样:
var app = angular.module("OIApp", ["ngRoute", "myControllers"])
Controller.js 是这样的:
angular.module('myControllers', [])
.controller('OIController1', function($scope, $route) {
$scope.names = [
{name:"Colin Wilson", blurb: "Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."},
{name:"Graham Hancock", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."},
{name:"John Moriarty", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also ..."},
{name:"William Thompson", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."}
];
});
配置文件:
angular.module('myRoutes', ['ngRoute', 'myControllers'])
.config('$routeProvider', function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "/index.html",
controller : "OIController1",
})
.when("/about", {
templateUrl : "/about.html",
controller : "OIController1"
})
.otherwise({
redirectTo:'/'
});
});
这是我试图在 ngView 中呈现的 about.html:
<div class="col-sm-2" ng-repeat="x in names">
{{x.name}}
{{x.blurb}}
</div>
最佳答案
有几个问题:
//------------------------------------
//Let say, it's a app.router.js
//------------------------------------
angular.module('myRoutes', ['ngRoute', 'myControllers'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "index.html",
controller : "OIController1",
})
.when("/about", {
templateUrl : "about.html",
controller : "OIController1"
})
.otherwise({
redirectTo:'/'
});
}]);
//------------------------------------
//Let say, it's a app.module.js
//------------------------------------
angular.module("OIApp", ["ngRoute", "myRoutes", "myControllers"]);
//------------------------------------
//Let say, it's a app.controller.js
//------------------------------------
angular.module('myControllers', [])
.controller('OIController1', function($scope) {
$scope.names = [
{name:"Colin Wilson", blurb: "Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."},
{name:"Graham Hancock", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."},
{name:"John Moriarty", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also ..."},
{name:"William Thompson", blurb:"Commodities are usually raw materials such as metals and agricultural products, but a commodity can also..."}
];
});
我希望这能奏效
关于javascript - ngView 不呈现模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40103567/
当我在各种浏览器或使用节点的本地主机上运行时,我无法在我的 Angular 应用程序的 ng-view 中呈现模板。控制台没有抛出任何错误。我已经阅读了我可以在网上找到的关于这个问题的所有内容,但没有
我有一个div,它是ng-view。 Loading... 我也有一部分。类似这样的事情: 我还有一些 Controller 的代码。 有没有办法将另一个具有单独 Controller
我正在使用模板来构建我的应用程序。基本上只有一个主页,然后我使用 ng-view 通过它加载其他页面。 index.html 中的 href 链接工作正常。但我也希望能够在 js 函数中更改 ng-v
当我从索引访问我的页面并开始浏览时一切正常,但是当我在 / 以外的路线上时例如在 /details/123我刷新页面(我配置了 URL 重写)路由设置不正确。 这意味着,当我从索引正常浏览时检查位
举个例子: 我在 ngView 中有具有以下结构的指令: .directive('features', function() { templateUrl: '.../', link:
当我点击链接加载 ngView 页面时,html 文件不会显示。 我没有通过本地主机运行应用程序,我怀疑这可能是问题所在。我刚刚用 Chrome 打开了 index.html,所以也许 ngRoute
我正在尝试实现一个包含导航栏的页面(http://getbootstrap.com/components/参见导航栏),并且页面的内容是通过ngView从部分html插入的。但是,当单击下拉菜单时,整
我尝试在自定义指令中使用 ng-view 但它不起作用,而且也没有给我任何控制台错误。 这是我的指令: (function() { 'use strict'; angular
我正在使用 angularjs 和 jquery(用于菜单等),但我不知道为什么我不能使 jquery(eq.简单的 Accordion 菜单)像 this 那样工作。 ,全部在里面 ,我尝试了所有方
Angular 的初学者,我可能措辞不正确,但我不知道如何描述它。 当像这样发生路由变更时 .when('/manage/users', { templateUrl: 'Angular/man
根据 Angular 1.2 ngView 文档“进入和离开动画同时发生”,因此 ngView 更新过程的延时类似于 add new content > animate entering / leav
这是基本设置,它有一个默认的 noemployee.html 部分:作为 ng-view Index.html 内容: 我的路线提供商:
我正在学习 AngularJS,其中一项作业是这样的: Now, add a new div tag to our index.html with an attribute directive tha
我使用路由将不同的模板加载到 ngView 中。其中一个模板有一个简单的 Controller ,其中包含一组联系人。我在这里尝试做的很简单,只需单击链接 (ngclick) 调用函数并将新对象添加到
这是我当前的设置,每一列都由一个 Controller 表示: [column1] [column2] [column3] 此外,每一列都有一些信息(一个或多个变量和对象),这些信息在修改后需要传
我有一个基本的 PHP 应用程序,其中用户登录信息存储在 HTTP session 中。该应用程序有一个主模板,比如 index.html,它使用 ngView 切换 subview ,如下所示
当您使用具有 100 个不同 View 的 ngView 时,每个 View 具有不同的范围。 Angular 会自动处理销毁旧模板/作用域还是保留在内存中?在我开始编写自定义代码以减少内存负载之前,
我有一个带有按钮的 HTML 页面,单击该按钮会触发对外部服务的请求。此 post 请求返回一个 HTML 页面。 是否可以用此 HTML 内容替换当前的 ngView? $scope.clickEv
有没有办法在进入时为 ngView 的每个内容而不是 View(div) 本身设置动画? 最佳答案 除了使用过渡 API 为动画编写自定义 CSS 之外,没有其他方法可以制作动画,例如(过渡:所有线性
是否可以在不编写 routeProvider 的情况下使用 ng-view,即通过在标记部分中包含路由(我意识到混合逻辑和 View 不是最好的设计,但在这种情况,因为它实际上是一个条件模板)。我的路
我是一名优秀的程序员,十分优秀!