Angular 1.5 component ...ng-link Issue

Question

I have nav bar Home Accounts Services Orders Tickets on click of Accounts there is drop-down with fields new Customer and Search Customer On click of new Customer it should navigate to home component.

view of root component:

<div class="dropdown">
    <a class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        <span class="tab_ico fa fa-user"></span>
        <span class="tab_name">ACCOUNTS</span>
        <span class="caret_holder"><span class="caret"></span></span>
    </a>
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <li><a href="#"><span class="tab_ico fa fa-search"></span> Search customer</a></li>
        <li><a ng-link="['Home']"><span class="tab_ico fa fa-user"></span> New customer</a></li>
    </ul>
</div>

As you can see ng-link="['Home']"

routeConfig:

$routeConfig: [  
    { path: "/dashboard", component: "dashboard",name:"Dashboard",useAsDefault: true },  
    { path: "/home", component: "home", name:"Home" },  
    { path: "/account", component: "account", name:"Account" },  
    { path: "/**", redirectTo: ["Home"] }  
],

Home Component

angular.module('app.home').component("home", {
    templateUrl: "app/components/home/homeview.html",

    controllerAs: "model",
    controller: function($scope, dataservice) {
        var vm = this;
        console.log("entered into home component");

    }
})

Home component view

<div>
    <ul>
        <li><span class="tab_ico fa fa-search"></span> SEARCH CUSTOMER <span class="closetab">x</span></li>
        <li class="k-state-active"><span class="tab_ico fa fa-user"></span> Identification <span class="closetab">x</span></span></li>
    </ul>
</div>

On click of new Customer it should display home component view, But it is not displaying home component view ?, no errors also.!!

Why you are not using `ngHref` instead of `ngLink`? – Juanjo Salvador Aug 22 '16 at 07:05 — Juanjo Salvador, Aug 22 '16 at 07:05

score 0 · Answer 1 · answered Aug 22 '16 at 08:24

0

You can use ngLink with an <a> element without href.

Instead of

<a href="#" ng-link="['Home']"><span class="tab_ico fa fa-user"></span> New customer</a>

Use this

<a ng-link="['Home']"><span class="tab_ico fa fa-user"></span> New customer</a>

I think that href can be the problem here.

Source: Angular Router docs

answered Aug 22 '16 at 08:24

Juanjo Salvador

1,073
1
12
33

I have removed href="#" then also same .... its not showing any thing, on click of new customer – Pavan Aug 22 '16 at 08:54

Angular 1.5 component ...ng-link Issue

1 Answers1