Ang-ng包含onload方法不能正常工作

我使用基礎和角度的大部分我有它的工作，但遇到了一個小問題。我正在使用基礎選項卡，並且當角度控制器將其連接起來時，第一個選項卡似乎重複，並且當我單擊其他任何選項卡時，它總是會堆疊在第一個選項卡頂部。Ang-ng包含onload方法不能正常工作

奇怪的是，當我用檢查器中的任何css風格修補它只是神奇的作品。例如，如果我在任何地方切換任何樣式。如果我運行一個警告，它會觸發ng-include的onload，我也可以使它工作。我認爲setTimeout會做的伎倆，但沒有奏效。下面請查看我的代碼，讓我知道你認爲可能是問題，或者如果我做錯了什麼。感謝和任何幫助表示讚賞。

.controller('MyAppCtrl', ['$scope', function ($scope) { 
    $scope.tabs = [ 
     { tabID:'0', title:'title1', content:'templates/tab-one.html'}, 
     { tabID:'1', title:'title2', content:'templates/tab-two.html'}, 
     { tabID:'2', title:'title3', content:'templates/tab-three.html'} 
    ]; 
    $scope.currentIndex = 0; 
    $scope.initTabs = function() { 
     alert($scope.currentIndex); 
    }; 
    $scope.isCurrentSlideIndex = function(index) { 
     return $scope.currentIndex === index; 
    } 
}]);

HTML

<tabset> 
    <tab ng-repeat="tab in tabs" heading="{{tab.title}}" content=" 
    {{tab.content}}" active="tab.active"> 
     <ng-include onload="initTabs($index)" src="tab.content"></ng-include> 
    </tab> 
</tabset>

來源

2014-09-03 Galactic Ranger

''上吳tabset'，init'？ 'ng-repeat'和'ng-inclue'有它自己的範圍。 – allenhwkim 2014-09-03 21:35:55

謝謝，但我試圖解決的問題是，當我導航其他選項卡時，第一個選項卡不會卸載。奇怪的是，當我在Chromes web inspector中修改樣式時，它卸載了第一個選項卡，事情看起來很好。我還注意到，當我調整窗口大小時，它也解決了問題。 – 2014-09-04 18:31:12

我認爲你需要提供一個plnkr來解決你的問題。 – allenhwkim 2014-09-04 21:23:38

經過一些故障排除後，我能夠找出導致問題的標籤內容顯示不正常的原因。將Angular與Foundation框架端口一起使用時，只要使用css而不是sass，只要我刪除了sass，就可以導入正確顯示的所有內容。我最初認爲這個問題是由ng-include中的onload引起的，但是在閱讀Angular Foundation上的文檔之後，我意識到sass選項還沒有被css選項支持。

Plunker example

<!doctype html> 
<html ng-app="plunker"> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.js"></script> 
<script src="//pineconellc.github.io/angular-foundation/mm-foundation-tpls-0.3.1.js"></script> 
<script src="example.js"></script> 
<link href="//cdnjs.cloudflare.com/ajax/libs/foundation/5.2.0/css/foundation.css" rel="stylesheet"> 
</head> 
<body> 

<div ng-controller="TabsDemoCtrl"> 
<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>

來源

2014-09-05 00:09:15

我不太明白的問題是什麼，但看着你的代碼中，我發現的東西，它不能be wright：

您的功能initTabs不帶任何參數，但是當你把它要傳遞的標籤的$index，也許你想要一個功能，看起來像這樣：

$scope.initTabs = function(index) {...}

如果這沒有幫助，請你添加一個鏈接到的jsfiddle或以Plunker你的問題的一個例子，以便我們可以重現它並嘗試修復它？謝謝！

來源

2014-09-03 21:35:26 Josep

謝謝，我更新了。不是真的問題。我會在jsfiddle上放一些東西，希望能更好地交流我的問題。 – 2014-09-04 18:28:20

Ang-ng包含onload方法不能正常工作

回答

相關問題