title: how to use angular ui-sref
body: <p>I've got a table of order data with links to edit the order if they're not 'healthy'.</p>
  
  <p>I'm not sure how to use the ui-sref to link back to my edit page, passing it the specific order Id. (I'm supposed to use ui-sref, right? Using href in a routed app is cheating is it not?)</p>
  
  <p>This is the error I get:</p>
  
  <blockquote>
    <p>Could not resolve '#/editlisting/3' from state 'layout.orders'</p>
  </blockquote>
  
  <p>Here's a snippet of code in my controller:</p>
  
  <pre><code>OrderService.getOrders().then (
    function success(response) {
      vm.Orders = response;
        angular.forEach(vm.Orders, function (order, k) {
          if (!order.listing.Completed) {
            order.Health.push({
              message: "Missing listing info.",
              link: "/editlisting/" + order.listing.Id
            });
          };
       )};
     }
  });
  </code></pre>
  
  <p>All I am concerned about right now is</p>
  
  <pre><code>link: "/editlisting/" + order.listing.Id
  </code></pre>
  
  <p>A snippet of the html:</p>
  
  <pre><code>&lt;tr ng-repeat="health in order.Health"&gt;
    &lt;td&gt;
      &lt;div ng-repeat="health in order.Health"&gt;
        &lt;a ui-sref="{{health.link}}"&gt;{{health.message}}&lt;/a&gt;
      &lt;/div&gt;
    &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>My route looks like this:</p>
  
  <pre><code>        $stateProvider
              .state('layout.editlisting', {
                  url: '/editlisting/:id',
                  templateUrl: 'Content/js/apps/store/views/edit_listing.html',
                  controller: 'editListingController',
                  controllerAs: 'listingVm',
                  data: { pageTitle: 'Edit Listing' }
              })
  </code></pre>
  
  <p>(If I've mistyped a var or ref somewhere, don't worry too much about it. My problem is with the actual linking)</p>
  
  <p>So, in a nutshell, this:</p>
  
  <pre><code>&lt;a ui-sref="{{health.link}}"&gt;{{health.message}}&lt;/a&gt;
  </code></pre>
  
  <p>gives me this:</p>
  
  <blockquote>
    <p>Could not resolve '#/editlisting/3' from state 'layout.orders'</p>
  </blockquote>
  
  <p>Although this works fine:</p>
  
  <pre><code>&lt;a href="{{health.link}}"&gt;{{health.message}}&lt;/a&gt;
  </code></pre>
  
  <p>But that's bypassing the router completely, is it not?</p>