function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Qin LuQin Lu 

Create a drill down for a field in visual force page using Angular JS

I have a visual force page using angular JS. I have include this page as a section in Contact standard page.  I need to create a drill down for one of the field to naviage a standard detail page. I understand how to do this in visual force page using outputlink. But my page is using Angular JS, 
If I do the following

<div  class="card"  ng-repeat="story in stories">
      <a id="link-3" ng-href = "/{{story.Id}}">{{story.title}}</a>
</div>

it opens the iframe in current section. 

If I use do the following as I used in outputlink


<a id="link-3" ng-href ="window.top.location.href ='/{{story.Id}}'">{{story.title}}</a>
or
<a id="link-3" ng-click ="window.top.location.href ='/{{story.Id}}'">{{story.title}}</a>
neither one is working at all. I can see story.Id is resolved correctly when I inspect element in browser. 

Any help is appreciated !
AshwaniAshwani
Is iframe is opened by default in Angular then you don't needf to use window.top.  <a id="link-3" ng-href ="/{{story.Id}}'">{{story.title}}</a> should work. Also check in browser you may get cross-origin security error in browser which blocks access to different domain and sub-domain. 
Qin LuQin Lu
The visual force page is embeded in Contact detail as a section, using  <a id="link-3" ng-href ="/{{story.Id}}">{{story.title}}</a> opens the target page inside current Contact detail page, I need to navigate to a new page to open the target detail page. 
If using apex tag   <apex:outputLink value="/{!fa.id}" onClick="window.top.location.href = '/{!fa.id}'; return false;">{!fa[field]} </apex:outputLink> does the trick, but I can't use apex tag because I have alrady used ng-repeat, using apex tag, story variable is not recognized.