winjs angular splitcript with splitView

我正在嘗試使用winjs與角和打字稿。只要我不必爲Dom-Elements使用一些額外的JavaScript，Angular-Winjs包裝工作正常。winjs angular splitcript with splitView

在我的情況下，我想使用拆分視圖項：菜單得到顯示，但JavaScript函數所有者無效。

這是我的代碼：

<win-split-view-pane-toggle split-view="splitViewElement"></win-split-view-pane-toggle> 
<win-split-view id="splitView"> 
    <win-split-view-pane> 
     SplitView Navigation Pane 
     <win-split-view-command label="'Home'" icon="'home'" on-invoked="goToHome()"></win-split-view-command> 
     <win-split-view-command label="'Settings'" icon="'settings'" on-invoked="goToSettings()"></win-split-view-command> 
    </win-split-view-pane> 
    <win-split-view-content>SplitView Content Area</win-split-view-content> 
</win-split-view>

這是來自GitHub的項目方的示例代碼。

他們的例子也說我要加入到我的控制器：

angular.module("yourAngularApp", ["winjs"]).controller("yourController", function ($scope) { 
    $scope.splitViewElement = document.getElementById("splitView"); 
});

我現在的問題是，我使用的打字稿及創建我與controllerAs語法控制器。當我添加

$scope.splitViewElement = document.getElementById("splitView");

我的控制器，splitView元素爲NULL。

我還試圖用

angular.element("splitView").context

它有一個元素，但它不能正常工作了。

這是我的控制器。

constructor($scope, $state, $http, $q) { 
    super($state, $http, $q, $scope, true); 

    $scope.splitViewElement = document.getElementById("splitView"); //this is null 
    $scope.splitViewElement = angular.element("splitView").context; //this is not null 

     }

來源

2015-11-02 Tobias Koller

鑑於圖書館是不是如此普遍，我會問筆者：https://github.com/winjs/angular-winjs/issues –

@馬丁：是的，這就是我今天所做的。我通過nuget與他們聯繫......希望他們能回答;） –

可能會遲到，但這裏是如何爲我工作。在我的控制，我查詢元素與angular.element

vm.splitViewElement = angular.element("#splitView")[0];

如果元素是可用的它應該是數組中的第一個。現在，只需將vm.splitViewElement綁定到您的看法：

<win-split-view-pane-toggle class="win-splitviewpanetoggle" split-view="vm.splitViewElement"> 
</win-split-view-pane-toggle>

來源

2016-02-11 22:29:11 Dimi

winjs angular splitcript with splitView

回答

相關問題