标签: ng-view
AngularJS - 单个模板中的多个ng视图
我正在使用AngularJS构建一个动态Web应用程序.是否可以ng-view在单个模板上使用多个？
推荐指数
解决办法
查看次数
如何在ng-include中嵌套ng-view？
在尝试添加ng-view内部时ng-include,没有任何反应.例如,在下面的代码中,当themes/midnight/index.html成立时ng-view,不会呈现任何视图:
<ng-include src="'themes/midnight/index.html'"></ng-include>
但是,如果我使用下面的代码,视图会显示两次:
<ng-include src="'themes/midnight/index.html'"></ng-include>
<div ng-view></div>
有什么问题,如何解决？
推荐指数
解决办法
查看次数
Bootstrap data-spy ="affix"无法处理Angular View更改
我正在试图找出为什么affix当我改变我的Angular视图时我的面板不会保持不变.
我已将affix属性直接添加到第一页的面板(详细信息),并将其保留在数据间谍中仅在第二页(航班)中.
在一个完整的网络版本中,如果我刷新航班页面,突然启动词缀,并在滚动时保持放置,但如果我只是使用Angular导航到页面则不会.
当我在视图之间导航时,看起来这个词缀没有被Bootstrap添加到类中.
HTML:
<div class="panel panel-primary mySidebar" id="sidebar"
data-spy="affix" data-offset-top="0" data-offset-bottom="200">
CSS:
.mySidebar.affix {
position: fixed;
top: 250px;
}
.mySidebar.affix-bottom {
position: absolute;
top: auto;
bottom: 450px;
}
这是一个Plunker ..
http://plnkr.co/edit/S0Bc50?p=preview
我在这里找到了一个类似的问题:
Twitter Bootstrap:在单页面应用程序中不会触发粘贴
但我无法弄清楚如何将这个应用于我的问题......
任何帮助都会很棒!
推荐指数
解决办法
查看次数
Angularjs路由无法正常工作
一切正常,直到我尝试添加路由.我读到Angularjs版本1.2+要求'ngRoute'作为依赖项(我使用的是版本1.2.16).我添加了它,但它仍然无效.以下是我的代码.
test.html(主页)
<html ng-app="demoApp">
<head>
<title></title>
</head>
<body>
<p>Front Page</p>
<div ng-view></div>
<script src="angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.js"></script>
<script src="testjs.js"></script>
</body>
</html>
testjs.js
demoApp = angular.module('demoApp',['ngRoute']);
demoApp.config(function ($routeProvider) {
$routeProvider.when('/', {
controller: 'SimpleController',
templateUrl: '/partials/first.html'
});
});
var controllers = {};
controllers.SimpleController = function ($scope){
$scope.first = "Info";
$scope.customers=[
{name:'jerry',city:'chicago'},
{name:'tom',city:'houston'},
{name:'enslo',city:'taipei'}
];
};
demoApp.controller(controllers);
first.html
<div>
<input type="text" ng-model="name"/>
</br>
{{first}}
</br>
<ul>
<li ng-repeat="cust in customers | filter:name">{{cust.name | uppercase}} - {{cust.city}}</li>
</ul>
</div>
推荐指数
解决办法
查看次数
如果我更改angularjs中的视图,为什么我的twitter小部件不会渲染？
嗨,谢谢你的阅读.
我有一个角色应用程序正在制作和我偶然发现了一个问题.如此设置
index.html-
<html ng-app="myApp">
...
<div ng-view></div>
<div ng-include="'footer.html'"></div>
...
</html>
我不会打扰我的路线很简单/家是显示/home/index.html等等...
/home/index.html(当你来到网站时的默认视图)
<div class="responsive-block1">
<div class="tweet-me">
<h1> tweet me </h1>
</div>
<div class="twitter-box">
<twitter-timeline></twitter-timeline>
</div>
twitter时间线指令
directives.directive("twitterTimeline", function() {
return {
restrict: 'E',
template: '<a class="twitter-timeline" href="https://twitter.com/NAME" data-widget-id="XXXXXXXXXXXXXX">Tweets by @NAME</a>',
link: function(scope, element, attrs) {
function run(){
(!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"));
console.log('run script');
};
run();
}
};
});
所以我刚刚使用twitter上的标签创建了一个基本的twitter指令.但是当我将视图示例更改为/ blog然后返回/ home时,twitter小部件根本不再呈现.
我也使用$ anchorScroll,如果我在页面上跳转到这个小部件也会消失.任何信息都会非常感谢.
推荐指数
解决办法
查看次数
ng-view无法在Microsoft Edge上运行
我正在Microsoft Edge上测试我的应用程序,它会抛出此错误:
app.config(
function ($routeProvider) {
$routeProvider.
when('/logout', {
template: '<logout-page></logout-page>'
})
.when('/', {
template: '<application-manage></application-manage>'
})
});
在我的索引中:
<body style="height: 100%">
<div class='main-div' style="height: 100%;" ng-view ng-class="slide">Loading....</div>
</body>
第一种情况:'<application-manage></application-manage>'它正常工作.但是当我点击退出时.它抛出错误:
SyntaxError <div class="main-div ng-scope" style="height: 100%" ng-class="slide" ng-view="">
感谢大家.问题解决了,这是因为我使用基本身份验证的方式:
jQuery.ajax({
type: "GET",
url: logoutURL ,
async: true,
username: fakeUser,
password: fakePassword,
headers: {"Authorization": "Basic Authorization"}
}).done(function () {
console.log("Can not logout Basic Authentication in this browser");
defer.resolve(true);
}).fail(function () {
console.log("You have successfully logged out!");
defer.resolve(true);
});
从: …
angularjs angularjs-directive angularjs-ng-click ng-view microsoft-edge
推荐指数
解决办法
查看次数
ng-view更改时获取标头
我们所有的内容页面都有一个特定的标题X-Foo.当内容ng-view发生变化时,我们希望X-Foo在不同的元素中显示新页面的标题.每当内容发生变化时,我们如何获得此值？
编辑:由于这显然不清楚,标题是在响应中,而不是请求.
推荐指数
解决办法
查看次数
如何使用Angular执行多个视图以支持标题和侧边栏？
我第一次使用AngularJS.我已ng-view在我的index.html页面中成功实现了一个包含header.html模板的单个内容.所以它看起来像下面
但现在我正在创建一个仪表板(dashboard.html).所以,我还有一个左侧菜单,header.html所以它看起来像这样:
我的index.html与此类似:
<div ng-include="'templates/header.html'"></div>
<div class="main" id="main-no-space" >
<div id="main-page">
<div id="wrapper" class="container">
<div class='container'>
<div ng-view></div>
</div>
</div>
</div>
<div ng-include="'templates/footer.html'">
我的dashboard.html与此类似:
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li class="active">
<a ng-href="#/link1">Link 1</a>
</li>
<li>
<a ng-href="#/link2">Link 2</a>
</li>
<li>
<a ng-href="#/link3">Link 3</a>
</li>
</ul>
</div>
推荐指数
解决办法
查看次数
angularjs中主页的多个ng视图
好吧,我刚接触角度,刚刚开始使用ngRoute和ngView指令,我遇到的问题对我来说是一个问题,但我怀疑这只是一个问题,因为我缺乏经验.
我的index.html页面上有以下标记(简化):
<html>
<head>
<title>Sample APP</title>
</head>
<body>
<div class="header">
<nav class="pull-right">...</nav>
</div>
<div class="main" ng-view>
</div>
<div class="footer">
</div>
</body>
</html>
以上是我的页面使用的默认布局结构.现在我的问题是单独的主页,在div中显示一个滑块显示类"header".像这样:
<div class="header">
<nav class="pull-right">...</nav>
<div class="slider">...</div>
<div>
现在这只是为了主页,所以我对如何实现这一点感到困惑.我的索引页面上是否需要两个 ng-view指令？例如:
<html>
<head>
<title>Sample APP</title>
</head>
<body>
<div class="header">
<nav class="pull-right">...</nav>
<div class="slider" ng-view>...</div>
</div>
<div class="main" ng-view>
</div>
<div class="footer">
</div>
</body>
</html>
此外,如果你需要知道我为什么这样做,这只是因为我在网上买了一个html模板,现在我正在尝试将angularjs集成到模板中.
推荐指数
解决办法
查看次数
加载角度视图
每当我们.html以角度加载服务某些控制器的文件时.不angular使一个ajax调用以检索该html.
喜欢这段代码.
.state('home', {
url: '/',
templateUrl: '/Modules/Signin/signin.html',
controller: 'SigninCtrl'
})
我的意思是在提取signin.html时询问
- 是
ajax打电话了吗？ - 或者它们是否作为普通资源加载？
- 如果
ajax打电话,我在哪里可以找到一些关于它的文件.
推荐指数
解决办法
查看次数
标签 统计
angularjs ×10
ng-view ×10
javascript ×2
affix ×1
ajax ×1
css ×1
html ×1
http-headers ×1
ngroute ×1
twitter ×1