======================================= halaman html======== ==================================================
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="joyKit" content="675674454@qq.com">
<title>joyKit,Everything just for the best</title>
<link rel="apple-touch-icon" href="http://huaban.com/img/touch-icon-ipad-retina.png">
<link rel="apple-touch-icon" sizes="76x76" href="http://huaban.com/img/touch-icon-ipad-retina.png">
<link rel="apple-touch-icon" sizes="120x120" href="http://huaban.com/img/touch-icon-ipad-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="http://huaban.com/img/touch-icon-ipad-retina.png">
<link rel="canonical" href="http://huaban.com/"><!--pc和moblie跳转适配-->
<meta name="keywords" content="joyKit">
<meta name="applicable-device" content="pc,mobile">
<meta name="description" content="joyKit,Everything just for the best">
<link rel="stylesheet" href="css/xhKit.css">
<link rel="stylesheet" href="css/top.css">
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
</head>
<body>
<p ng-controller="index as vm" ng-cloak class="ng-cloak frame-wrap">
<p ng-include="'top.html'"></p>
<background>
<figure>
<figcaption>
<input class="seek" type="text" value="{{vm.ss}}">
</figcaption>
</figure>
</background>
</p>
<!--begin 公共js-->
<script src="lib/jqlite.min.js"></script>
<script src="lib/angular.min.js"></script>
<script src="js/app.js"></script>
<script src="lib/wow.min.js"></script>
<!--end 公共js-->
<!--begin 控制器js-->
<script src="index.js"></script>
<!--end 控制器js-->
<!--begin 指令js-->
<script src="directive/switchBackground.js"></script>
<!--end 指令js-->
<script>
$(function () {
var wow = new WOW({
boxClass: 'wow',
animateClass: 'animated',
offset: 0,
mobile: true,
live: true
});
wow.init();
});
</script>
</body>
</html>
================================ index.js ========================== ====
/**
* Created by joykit on 2016/12/23.
*/
(function () {
var controllerId = 'index';
angular.module('app').controller(controllerId, ['$scope', function ($scope) {
var vm=this;
vm.ss='xx';
}]);
});
================================ app.js ========================== ====
/**
* Created by joykit on 2017/1/12.
*/
(function () {
'use strict';
var app = angular.module('app', [
]);
// app.config([
// '$stateProvider', '$urlRouterProvider', '$locationProvider',
// function ($stateProvider, $urlRouterProvider, $locationProvider) {
// $urlRouterProvider.otherwise("dashboard");
// $stateProvider
// .state('dashboard', {
// url: '/dashboard',
// templateUrl: '/App/Metronic/views/home/dashboard.cshtml',
// menu: 'System.Dashboard.Home' //Matches to name of 'System.Dashboard.Home' menu in LJTNavigationProvider
// })
// .state('createOrUpdateDepartment', {
// url: '/createOrUpdateDepartment',
// templateUrl: '/App/Metronic/views/departments/createOrUpdateDepartment.cshtml',
// menu: 'System.Department.Create'//System.Department.Edit
// })
// }
// ]);
})(angular);
<p ng-controller="index as vm" ng-cloak class="ng-cloak frame-wrap"> Pada langkah ini, pastikan vm tidak kosong