angularjs routing without links

Question

I have two problems.
First my test.html doesn't "see" the products array from his controller.
I don't know why, I have connected the controller with the html in the routing.config.js.

var myapp = angular.module('myapp', ["ui.router", "ngAnimate"]);

myapp.config(function($stateProvider, $urlRouterProvider){    
  $stateProvider
      .state("foo", {
          url: "/foo",
          templateUrl:'start.html'
      })
      .state("test", {
          url: "/test",
          templateUrl: 'test.html',
          controller:'product-controller',
          parent:'foo'
      })

  $urlRouterProvider.otherwise("/foo");
})

myapp.controller('navCtrl', function($scope, $state){

  $scope.navigateTo = function(target){
     $state.go(target);
  }
});

the second thing I want is that the test.html will be activated without the click on the link.
If the mainpage is loaded, the test.html should be loaded too.
At the end I want to delete the <ul> but the result should be the same. (the foo and the dropdown).

I have made a PLUNK where you can see the problem.

The only solution I had, is to integrate the test.controller.js in the routing.config.js and the test.html in the start.html.
But i hope to avoid this because it makes the code more confusing.

I also looked at the ui-router docs but it doesn't work for me.

    .state("foo.test", {
          url: "/test",
          templateUrl: 'test.html',
          controller:'product-controller',
          parent:'foo'
      })

I hope someone has an idea... thank you! =)

Read ui-router docs and look at demo regarding nested views

charlietfl
– charlietfl

2016-03-11 15:14:01 +00:00
Commented Mar 11, 2016 at 15:14 — charlietfl
– charlietfl, Commented Mar 11, 2016 at 15:14

chris · Accepted Answer · 2016-03-11 16:48:07Z

1

I would take @charlietfl's advice and read up on nested views. Other than that, you had a few errors in your plunkr:

Forgot to load test-controller.js in index.html
Forgot to inject the product-selection module to myapp (so it can resolve the respective controller)
Forgot to add the ngModel to the select element in test.html for data binding to work as expected

Here's your plunkr updated with the select control populated properly.

answered Mar 11, 2016 at 16:48

chris

1,8171 gold badge14 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

angularjs routing without links

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related