使用Require时角度控制器的位置在哪里？

Question

我是Angular +的新手要求所以请耐心等待，因为我在网上找不到这些信息。

据我所知，ng-app并未在html中声明，因为它是手动引导的，但是如何使用ng-controller？或者没用过？

In this plunk我有一个在Require下运行的Angular应用程序，但未显示$ scope字段，是因为控制器声明不正确吗？

HTML

This is the name: {{name}}
<br>
This is the toggle: {{singleModel}}
<br>
<button type="button" class="btn btn-primary" ng-model="singleModel" 
     uib-btn-checkbox btn-checkbox-true="1" btn-checkbox-false="0">
    Single Toggle
</button>

<script data-main="main" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js"></script>

Javascript - main.js

require.config({
    paths: {
        angular: 'https://code.angularjs.org/1.2.16/angular',
        uiBootstrap : 'https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.4.0/ui-bootstrap-tpls',
        app: 'app'
    },
    shim: {
        'angular': {
            exports: 'angular'
        },
        uiBootstrap: { 
          exports: 'uiBootstrap', 
          deps: ['angular'] 
        },
        'app': ['angular']
    }
});

require(['angular', 'app'], function(angular) {
    'use strict';
    angular.bootstrap(document, ['app']);
});

Javascript - app.js

define([
  'angular', 
  'uiBootstrap'
], function (angular) {

  var app = angular.module('app', ['ui.bootstrap']);

  app.controller('mainCtrl', function($scope) {
    $scope.name = 'World';
    $scope.singleModel = 1;
  });

});