Is it possible to use an html for two different urls in Angularjs?

Navigation
1

I want to use the same html for two different routes, but hiding certain elements for one or the other. Is it possible?

For example I have: 

share: {
  url: '/administration/share_view',
  templateUrl: 'administration/copy/share_view.html',
  controller: 'DialogDemoCtrl',
  name: 'tableShare'
},
publish: {
  url: '/administration/publish_view',
  templateUrl: 'administration/copy/share_view.html',
  controller: 'DialogDemoCtrl',
  name: 'tablePublish'
}

and this is the html 

  <div class="copy-container" ng-controller="DialogDemoCtrl as DialogDemoCtrl">

<div class="container">
  <div class="row mt10">
    <p class="bold fs16" ng-if="location.path() != '/tablePublish'">Lista de usuarios con acceso a la ficha</p>
    <p class="bold fs16">¿A quiénes desea notificar de la publicación?</p>
    <table class="table table-striped">
      <thead>
      <tr>
        <th>Seleccionado</th>
        <th>Nombre</th>
        <th>Email</th>
        <th ng-if="location.path() != '/tablePublish'">Ultimo envio</th>
        <th ng-if="location.path() != '/tablePublish'">Acciones</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>
          <input type="checkbox" class="ml20">
        </td>
        <td></td>
        <td></td>
        <td ng-if="location.path() != '/tablePublish'"></td>
        <td ng-if="location.path() != '/tablePublish'">
          <a href="#" class="btn btn-pacificblue mr5 p5 p0">Reenviar</a>
          <a href="#" class="btn btn-pacificblue mr5 p5 p0">Remover</a>
        </td>
      </tr>
      </tbody>
    </table>
  </div>

  {{location.path()}}

  <div class="row text-right">
    <a class="btn btn-danger" ng-if="location.path() != '/tablePublish'">Enviar a todos los seleccionados</a>
    <a class="btn btn-danger">Publicar y notificar a los seleccionados</a>
  </div>
</div>

The items are hidden, but they are not displayed in the route that I want them to appear.

    
asked by pasasalron 19.12.2016 в 13:48
source

2 answers

0

From what I see, you have the same html code and the same controller but there are 2 types of actions. Therefore I recommend that you evaluate all this from your controller 

.controller('DialogDemoCtrl', function($scope, $location){
    $scope.viewPublish = false;
    if($location.path() == '/administration/publish_view'){  
        $scope.viewPublish = true;
    }
})

And in your view: 

 <th ng-show="!viewPublish">Ultimo envio</th>
 <th ng-show="viewPublish">Acciones</th>

In this particular case: 

<tr>
  <td>
      <input type="checkbox" class="ml20">
  </td>
  <td></td>
  <td></td>
  <td ng-show="viewPublish"></td>
  <td ng-show="viewPublish">
      <a href="#" class="btn btn-pacificblue mr5 p5 p0">Reenviar</a>
      <a href="#" class="btn btn-pacificblue mr5 p5 p0">Remover</a>
  </td>
</tr>
    
answered by 19.12.2016 / 14:32
source
1

Keep in mind that you could use the clause resolve when declaring the different views, so the definition of your routes would be as follows: 

share: {
  url: '/administration/share_view',
  templateUrl: 'administration/copy/share_view.html',
  controller: 'DialogDemoCtrl',
  name: 'tableShare',
  resolve: {
            route: 'tableShare'
        }
},
publish: {
  url: '/administration/publish_view',
  templateUrl: 'administration/copy/share_view.html',
  controller: 'DialogDemoCtrl',
  name: 'tablePublish',
  resolve: {
            route: 'tablePublish'
        }
}

And from your controller you could use the 'route' dependency in the following way: 

.controller('DialogDemoCtrl', function($scope, route){
    $scope.tablePublish= false;
    if(route == 'tablePublish'){  
        $scope.tablePublish = true;
    }
})

Given the controller, the view would look like this: 

<p class="bold fs16" ng-if="tablePublish">Lista de usuarios con acceso a la ficha</p>
    
answered by 19.12.2016 в 14:46
UWP C # Pass date picker to another error 40 sql server