Выполнить ng-include при нажатии кнопки - Angularjs

Question

Я хочу выполнить ng-include и показать содержимое только после нажатия кнопки. Я попытался использовать директиву ng-if и показать div, когда ng-model равен true, но его значение не изменилось в функции myFunction.

<div ng-controller='myCtrl'>
    <div ng-if='include==true' ng-include='"path"'></div>
    <input type="button" ng-click='myFuntion()'/>
</div>

.controller('myCtrl', function($scope){
    $scope.include = false;
    $scope.myFunction = function(){
        $scope.include = true;
    }
})

Answer 1

Я бы просто создал функцию, которая изменяет путь переменной на допустимый, не нужно делать ng-if

$scope.myFunction = function(newPath){
      $scope.path = newPath;
}

<div ng-include="path"></div>
<input ng-click="myFunction('path/to/file.html')" type="button />"

Answer 2

В вашей функции ng-click есть опечатка. myFuntion должно быть myFunction. Вы также можете просто использовать ng-if='include' вместо ng-if='include==true'.

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
     $scope.include = false;
     $scope.myFunction = function(){
        $scope.include = true;
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-if='include'>Clicked</div>
  <input type="button" ng-click='myFunction()'/>
</div>