2016-04-03 20 views
0

私はAngularJsでメニューを作っていますが、そのアイテムをクリックすると、そのページがクリックされたアイテムのセクションまでスクロールします。 私のコードは次のようである:私は明示的にAngularJs scrollTo問題

を書く場合には、このようなコードは、動作しませんが

script.js

var app = angular.module('allApps',['ui.bootstrap']); 
app.controller("menuCtrl",function($scope, $location, $anchorScroll){ 
    $scope.menuItems=[ 
         {page:"Biography", id:"bio"}, 
         {page:"Curriculum Vitae", id:"cv"}, 
         {page:"Gallery", id:"gallery"}, 
         {page:"Video", id:"video"}, 
         {page:"Press", id:"press"}, 
         {page:"News", id:"news"}, 
         {page:"Contact", id:"contact"} 
         ]; 

    $scope.scrollTo = function(id) { 
     $location.hash(id); 
     console.log($location.hash()); 
     $anchorScroll(); 
    }; 
}); 

menu.html

<ul class="nav nav-pills" id="mainMenu" ng-controller="menuCtrl"> 
    <li class="active"><a href="#/">Home</a></li> 
    <li ng-repeat="item in menuItems"><a ng-click="scrollTo('{{item.id}}')" href="">{{item.page}}</a> 
</ul> 

ng-click="scrollTo('bio')" 

それは(明らかに伝記ページへのすべてのリンクをスクロールします)。 私はAngularJsの方向を読むのが問題だと思っていましたが、私が火かき棒でそれを確認すると、正しいIDが表示されます。

あなたは何が間違っているか教えてください。

答えて

1

ng-clickディレクティブで正しく表現されていません。基本的には、{{}}補間ディレクティブを含むべきではありません。あなたはng-clickに提供する発現は、直接

ng-click="scrollTo(item.id)" 
+1

はどうもありがとうございましコントローラのコンテキストで評価します –

+0

@FabioMannitiことを知ってうれしい..おかげで:-) –