Javascript 角度引导中的制表符_Javascript_Angularjs_Twitter Bootstrap_Tabs_Angularjs Bootstrap

Javascript 角度引导中的制表符

javascript angularjs twitter-bootstrap tabs

Javascript 角度引导中的制表符,javascript,angularjs,twitter-bootstrap,tabs,angularjs-bootstrap,Javascript,Angularjs,Twitter Bootstrap,Tabs,Angularjs Bootstrap,我试图通过使用角度引导来显示几个选项卡，但我看不到显示的任何内容。我看到的只是一张空白的白纸我错在哪里 html- <html ng-app = 'myApp'> <head> <title>Chat</title> </head> <body> <div ng-controller="Tabs"> <tabset> <tab headin

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

我错在哪里

html-

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

我确保正确加载了所有脚本。但为什么不显示选项卡？我哪里出错了

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

编辑： “我的浏览器”中的控制台显示以下内容：

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: 我包括

在我的代码中。所有的错误都消失了

这就是显示的内容。

这是预期结果。

或

你应该装上助推器

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

在

和

或

你应该装上助推器

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

在

和

之间添加此选项，请参阅引导和搜索选项卡。是的，我做了。我只根据这里提供的演示示例编写了这段代码。您在控制台中看到任何错误吗？请确保您正确引用了angular bootstrap ui。在这里工作很好：好的@Skelly你能给我指一下引导ui文件吗？如果我从主站点下载，我只得到一个文件-“-bootstrap-tpls-0.13.1”。但是使用npm，我得到了一个包含许多文件的文件夹。我很困惑。要使用角度引导，我应该导入什么？请参阅引导和搜索选项卡。是的，我导入了。我只根据这里提供的演示示例编写了这段代码。您在控制台中看到任何错误吗？请确保您正确引用了angular bootstrap ui。在这里工作很好：好的@Skelly你能给我指一下引导ui文件吗？如果我从主站点下载，我只得到一个文件-“-bootstrap-tpls-0.13.1”。但是使用npm，我得到了一个包含许多文件的文件夹。我很困惑。我应该导入什么来使用角度引导？嗨，毗瑟奴，我试过这个建议。它不起作用，但错误更改为“加载资源失败：net:：ERR_FILE_NOT_FOUND”。这意味着它找不到文件“angular/template/tabs/tab.html”。有什么帮助吗？请看我的编辑。首先，我应该导入什么文件来使用角度引导？谢谢@Vishnu。我不认为我们需要单独链接引导，因为我们已经在使用角度引导。谢谢你的帮助！：）嗨，毗瑟奴，我试过这个建议。它不起作用，但错误更改为“加载资源失败：net:：ERR_FILE_NOT_FOUND”。这意味着它找不到文件“angular/template/tabs/tab.html”。有什么帮助吗？请看我的编辑。首先，我应该导入什么文件来使用角度引导？谢谢@Vishnu。我不认为我们需要单独链接引导，因为我们已经在使用角度引导。谢谢你的帮助！：）
chrome.exe --allow-file-access-from-files --disable-web-security

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">