OrlovEvgeny
@OrlovEvgeny
golang developer / DevOps

Почему не выполняются скрипты внутри ui-view?

Имеем
<!DOCTYPE html>
<html lang="en" ng-app="app">

<div ui-view="headerLayout"></div>
<div ui-view="content"></div>
<div ui-view="footerLayout"></div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.js"></script>

<script src="js/angular/app.js"></script>

</html>

app.js
/**
 * Created by root on 12.09.2016.
 */
'use strict';
var app = angular.module('app', ['ui.router']);

app.config(['$stateProvider', '$urlRouterProvider',
    function ($stateProvider, $urlRouterProvider) {

        $urlRouterProvider.otherwise("/");

        $stateProvider
            .state('loadApp', {
                url: '/',
                views: {
                    'headerLayout': {
                        templateUrl: 'template/layout/loadHeader.html'
                    },
                    'footerLayout': {
                        templateUrl: 'template/layout/loadFooter.html'
                    }
                }
            })
            .state('signin', {
                url: '/login',
                views: {
                    'headerLayout': {
                        templateUrl: 'template/layout/login/loginHeader.html'
                    },
                    'footerLayout': {
                        templateUrl: 'template/layout/login/loginFooter.html'
                    },
                    'content': {
                        templateUrl: 'template/layout/login/login.html'
                    }
                }
            })
            .state('clients', {
                url: '/clients',
                view: {
                    'headerLayout': {
                        templateUrl: 'template/layout/appHeader.html'
                    },
                    'footerLayout': {
                        templateUrl: 'template/layout/appFooter.html'
                    },
                    'content': {
                        templateUrl: 'template/layout/clients/clients.html'
                    }
                }
            })
            
}]);

Content:
<div id="particles-js"></div>
		<form class="login-form">
			<label class="form-title">Форма входа</label>
			<input type="text" class="form-input" placeholder="Логин" id="login">
			<input type="password" class="form-input" placeholder="Пароль" id="password">
			<label for="checkbox" id="log-check-label">
			<input type="checkbox" id="remember"> Запомнить
			</label>
			<button type="submit" id="login-btn" class="btn btn-default">Войти</button>
			
		</form>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
	<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
	<script src="../../js/particles/particles.js"></script>
	<script src="../../js/particles/app.js"></script>
	<script>
		console.log("hello");
	</script>

ui-router подгружает во вьюхи heder, footer и content.
Почему внутри content не выполняются js скрипты. Собственно элементарно console.log("hello"); не срабатывает.
Хотя со стилями все впорядке, стили прописанные внутри header применяются.
  • Вопрос задан
  • 316 просмотров
Решения вопроса 1
Angular вырезает скрипты из шаблонов, потому что их надо исполнять в контроллере
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы