Обновление
Вы можете просто использовать jQuery, чтобы скрыть другие элементы, кроме элемента с идентификатором needToDisplayThis , например:
$(document).ready(function(){
var elemToShow = $('#needToDisplayThis');
$('body').html('<div><h1>'+elemToShow.html()+'</h1></div>');
});
Во-первых, ваш ng-include myTable.html не должен содержать тегов <html><head></head><body></body></html>
.Используйте только разметку, которую вы хотите визуализировать, например: <div> test<h1 id="needToDispalythis">ds,<span>something</span></h1></div>
.
Таким образом, ваш основной HTML должен выглядеть следующим образом:
<html>
<head>this is head</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
<div ng-include="'myTable.htm'"></div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
});
</script>
</body>
</html>
И ваш включенный HTML должен выглядеть следующим образом:
<div>
<span>test</span>
<h1 id="needToDispalythis">ds,<span>something</span></h1>
</div>
Теперь, чтобы показать только элемент <h1>
, вам нужно скрыть элемент <span>
, поэтому добавьте к нему атрибут ng-hide
:
<span ng-hide="hideThis">test<span/>
Теперь просто установитеhideThis для $scope
в true:
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$scope.hideThis = true;
});
</script>
Итак, наконец, ваш основной html выглядит так:
<html>
<head>this is head</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
<div ng-include="'myTable.htm'"></div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$scope.hideThis = true;
});
</script>
</body>
</html>
и ваш myTable.html выглядит так:
<div>
<span ng-hide="hideThis">test<span/>
<h1>ds,<span>something</span></h1>
</div>