文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >角引导片

问角引导片
EN

Stack Overflow用户
提问于 2015-07-30 11:08:48
回答 1查看 781关注 0票数 1

我试图通过使用角引导来显示几个选项卡，但是我看不到任何显示的内容。我看到的只是一张空白的白纸。

我哪里错了？

html-

代码语言：javascript
复制
<html ng-app = 'myApp'>
  <head>
     <title>Chat</title>
  </head>
  <body>
   <div ng-controller="Tabs">
     <tabset>
        <tab heading="Static title">Static content</tab>
        <tab ng-repeat="tab in tabs" heading="{{tab.title}}"   active="tab.active">
         {{tab.content}}
        </tab>  
     </tabset>   
   </div>

<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-bootstrap/ui-bootstrap.js"></script> 
<script src="app.js"></script>

</body>    
</html>

app.js:，我的控制器在这里

代码语言：javascript
复制
var myApp = angular.module('myApp',['ui.bootstrap']);


myApp.controller('Tabs', function ($scope, $window) {

  $scope.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2', disabled: true }
  ];


});

我确保正确地加载了所有脚本。但是为什么没有显示标签呢？我哪里出错了？

任何帮助都将不胜感激。提前感谢！

编辑:我的浏览器中的控制台如下所示：

代码语言：javascript
复制
XMLHttpRequest cannot load file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tab.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.(anonymous function) @ angular.js:10514
angular.js:12330 Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tab.html'.
    at Error (native)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10514:11
    at sendReq (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10333:9)
    at serverRequest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10045:16)
    at processQueue (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14567:28)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14583:27
    at Scope.$eval (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15846:28)
    at Scope.$digest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15657:31)
    at Scope.$apply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15951:24)
    at bootstrapApply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:1633:15)(anonymous function) @ angular.js:12330
angular.js:10514 XMLHttpRequest cannot load file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tab.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.(anonymous function) @ angular.js:10514
angular.js:12330 Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tab.html'.
    at Error (native)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10514:11
    at sendReq (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10333:9)
    at serverRequest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10045:16)
    at processQueue (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14567:28)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14583:27
    at Scope.$eval (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15846:28)
    at Scope.$digest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15657:31)
    at Scope.$apply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15951:24)
    at bootstrapApply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:1633:15)(anonymous function) @ angular.js:12330
angular.js:10514 XMLHttpRequest cannot load file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tabset.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.(anonymous function) @ angular.js:10514
angular.js:12330 Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/Users/NIKHIL/Desktop/angular/template/tabs/tabset.html'.
    at Error (native)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10514:11
    at sendReq (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10333:9)
    at serverRequest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:10045:16)
    at processQueue (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14567:28)
    at file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:14583:27
    at Scope.$eval (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15846:28)
    at Scope.$digest (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15657:31)
    at Scope.$apply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:15951:24)
    at bootstrapApply (file:///C:/Users/NIKHIL/Desktop/angular/node_modules/angular/angular.js:1633:15)(anonymous function) @ angular.js:12330
2angular.js:12330 Error: [$compile:tpload] Failed to load template: template/tabs/tab.html (HTTP status: undefined undefined)
http://errors.angularjs.org/1.4.3/$compile/tpload?p0=template%2Ftabs%2Ftab.html&p1=undefined&p2=undefined
    at angular.js:68
    at handleError (angular.js:17530)
    at processQueue (angular.js:14567)
    at angular.js:14583
    at Scope.$eval (angular.js:15846)
    at Scope.$digest (angular.js:15657)
    at Scope.$apply (angular.js:15951)
    at bootstrapApply (angular.js:1633)
    at Object.invoke (angular.js:4450)
    at doBootstrap (angular.js:1631)(anonymous function) @ angular.js:12330
angular.js:12330 Error: [$compile:tpload] Failed to load template: template/tabs/tabset.html (HTTP status: undefined undefined)
http://errors.angularjs.org/1.4.3/$compile/tpload?p0=template%2Ftabs%2Ftabset.html&p1=undefined&p2=undefined
    at angular.js:68
    at handleError (angular.js:17530)
    at processQueue (angular.js:14567)
    at angular.js:14583
    at Scope.$eval (angular.js:15846)
    at Scope.$digest (angular.js:15657)
    at Scope.$apply (angular.js:15951)
    at bootstrapApply (angular.js:1633)
    at Object.invoke (angular.js:4450)
    at doBootstrap (angular.js:1631)(anonymous function) @ angular.js:12330

编辑2 : --我现在在代码中包含了<script src="ui-bootstrap-tpls-0.13.1.js"></script>。所有的错误都消失了。

，这就是所显示的.

​

​

这是预期的结果.

​

​

angularjs
twitter-bootstrap
tabs
angularjs-bootstrap
javascript
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-30 11:30:08

代码语言：javascript
复制
chrome.exe --allow-file-access-from-files

或

代码语言：javascript
复制
chrome.exe --allow-file-access-from-files --disable-web-security

你应该加载引导

代码语言：javascript
复制
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

在<head>和</head>之间添加这个

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/31722163

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档