我正在尝试创建菜单链接,允许用户滚动到单个页面上的各个位置而无需重新加载页面。我已经能够使用之前提出的一些问题来解决这个问题,但我正在努力使用directive
来完成这项工作。
我真的很感谢你的帮助!
以下是我们用来实现基本滚动的参考页面和概念:
href overrides ng-click in Angular.js
angularjs $anchorScroll sometimes refresh all page
您会在我的Plunker
中注意到有一个嵌入式菜单和一个指令菜单。嵌入式菜单和功能正在运行,但无法使我的指令菜单起作用。
以下是我的用于测试和设置的Plunker:
答案 0 :(得分:0)
如果其他人可能有类似的问题,我使用以下方法解决了我的问题:
<强> 1。我添加了此方法,以便通过我的** $result = $connection->fetchAll("SELECT shipregioncodes FROM shipregioncodes_shipregioncodes WHERE shipregioncodes=$postcode");
$count = count($result);
if($count==0){
$this->_messageManager->addError("hiiiiiiii");
throw new NoSuchEntityException(
__('Shipping is not available on provided zipcode %1', $postcode)
);
}
:**
Controller
请务必在控制器中添加 $scope.redirectTodiv = function (divname, event) {
var id = $location.hash();
$location.hash(divname);
$anchorScroll();
$location.hash(id);
};
和$location
作为依赖项!
<强> 2。这是我的菜单的代码:
$anchorScroll
第3。我只是将用于我的视图功能的<section class="adminMenu" ng-class="menuStateClass">
<h3>{{fusionTitle}}</h3>
<div id="minMaxMenu" ng-click="minMaxMenu()">
<img src="images/collapse.svg" title="Click to expand" width="23" height="23" id="menuExpand" class="collapseIcon" ng-class="arrowDirectionClass" /> <span ng-show="showMenuHideText">Hide Menu</span>
</div>
<nav class="side-nav">
<ul>
<li id="socialMediaClick"><a href ng-click="redirectTodiv('top', $event)"><img title="Post List" src="images/postList.svg" title="" height="25" /><span class="navText">Summary</span></a></li>
<li><a href ng-click="redirectTodiv('mentionList', $event)"><img title="Mentions List" src="images/postList.svg" title="" height="25" /><span class="navText">Mentions List</span></a></li>
<li><a href ng-click="redirectTodiv('volume', $event)"><img title="Volume" src="images/volumeHour.svg" title="" height="25" /><span class="navText">Volume</span></a></li>
<li><a href ng-click="redirectTodiv('mediaSource', $event)"><img title="Media Source" src="images/postSource.svg" title="" height="25" /><span class="navText">Media Source</span></a></li>
<li><a href ng-click="redirectTodiv('sentiment', $event)"><img title="Sentiment" src="images/sentiment.svg" height="25" /><span class="navText">Sentiment</span></a></li>
<li><a href ng-click="redirectTodiv('engagers', $event)"><img title="Engagers" src="images/engagement.svg" height="25" /><span class="navText">Engagers</span></a></li>
<li><a href ng-click="redirectTodiv('linkShares', $event)"><img title="Link Shares" src="images/source_list.svg" height="25" /><span class="navText">Link Shares</span></a></li>
<li><a href ng-click="redirectTodiv('hashtags', $event)"><img title="Hashtags" src="images/hashtag.svg" height="25" /><span class="navText">Hashtags</span></a></li>
<li><a href ng-click="redirectTodiv('appsUsed', $event)"><img title="Apps Used" src="images/twitterPlatform.svg" height="25" /><span class="navText">Apps Used</span></a></li>
<li><a href ng-click="redirectTodiv('demographics', $event)"><img title="Demographics" src="images/demographics.svg" height="25" /><span class="navText">Demographics</span></a></li>
<li><a href ng-click="redirectTodiv('wordCloud', $event)"><img title="Word Cloud" src="images/wordCloud.svg" height="25" /><span class="navText">Word Cloud</span></a></li>
<li><a href="#summary_social_mentions_social_media#/support"><img title="Support" src="images/help.svg" title="" height="25" /><span class="navText">Support</span></a></li>
</ul>
</nav>
</section>
指定为我的Controller
,以便在自定义Controller
中使用
Directive
注意:在<og-social-mentions-social-media-nav ng-controller="SocialMentionsAnalysisController"></og-social-mentions-social-media-nav>
和$scope
中跟踪Controller
非常重要。在我的情况下,我的Directive
功能很少,我对Directive
污染或冲突没有任何问题。