Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

ngHide/ngShow do not work on any element with ngInclude #4238

Closed
thardy opened this issue Oct 2, 2013 · 5 comments
Closed

ngHide/ngShow do not work on any element with ngInclude #4238

thardy opened this issue Oct 2, 2013 · 5 comments
Milestone

Comments

@thardy
Copy link

thardy commented Oct 2, 2013

This used to work in 1.1.5. I just upgraded to 1.2.0-rc.2, and it has broken a lot of my existing code.

Basically, the following no longer works...


    [div ng-hide="!loading" ng-include=" 'loading.tpl.html' "] [/div]

(having a devil of a time figuring out how to get escaped html in this post)

The ng-hide does absolutely nothing to the element in this new version.

Here's a fiddle displaying the problem - http://jsfiddle.net/thardy/4jKSB/

@symblify
Copy link

symblify commented Oct 2, 2013

Works if you change AngularJS to the latest snapshot http://code.angularjs.org/snapshot/angular.js

@EricWVGG
Copy link

EricWVGG commented Oct 7, 2013

This is covered in this issue:
#3584

@IgorMinar
Copy link
Contributor

this is fixed in master already

@cbugari
Copy link

cbugari commented Aug 17, 2016

Hi. Can anybody help me.
In index.html, I run ng-view, which code corresponds to Routing.js file. The menu calls two pages main.html and product.htm.
main.htm, has included another page called filterApp.html.
I need to hide a page element that is embedded main.html the filterApp.html. I have not succeeded.
If I take the include and put the code directly into main.html works. I read that ng-ng-hide and include not working properly. Is there anything I can do. I need to have it in separate files.
Here is the code of the pages.
Thank you so much

Index.html


<html ng-app="appDataBoard">
<body ng-controller="mainController" >
 <ul >
          <li >
               <a href="#/main" ></a>
           </li>
            <li >
                 <a href="#/product" > </a>
             </li>
        </ul>

        <div >
                  <div ng-view></div>
        </div>
</body>
</html>

Main.html

<div class="jumbotron text-center">
    <h1>main  Page</h1>

    <p>{{ message }}</p>
</div>

<!-- INCLUDE FILTER APPS-->
        <div ng-include="'./template/filterApp.html'" ></div>

Product.html

<div class="jumbotron text-center">
    <h1>Product Page</h1>

    <p>{{ message }}</p>
p ng-hide="hide1">este parrafo se debe borrar</p>
</div>

filterApp.html

<div ng-hide="hselect1"  >
            <select id="select-1" multiple="multiple" onchange="RecargaSelectBU()" >
            </select>
        </div>

Routing.js

// create the module and name it dbApp
    var dbApp = angular.module('appDataBoard', ['ngRoute']);

    // configure our routes
    dbApp.config(function($routeProvider) {
        $routeProvider

            // route for the home page
            .when('/main', {
                templateUrl : 'template/main.html',
                controller  : 'mainController'
            })

            // route for the about page
            .when('/product', {
                templateUrl : 'template/product.html',
                controller  : 'productController'
            })

    });

    // create the controller and inject Angular's $scope
    dbApp.controller('mainController', function($scope) {
        // create a message to display in our view
        $scope.message = 'Pagina principal';
        $scope.hselect1 = true;
    });

    dbApp.controller('productController', function($scope) {
        $scope.message = 'Pagina de producto.';
        $scope.hide1 = true;

    });


@gkalpak
Copy link
Member

gkalpak commented Aug 18, 2016

@cbugari, this sounds like a general support question. Please, use one of the appropriate support channels for these types of questions.
GitHub issues are reserved for bug reports and feature requests.

Thx !

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants