Проблемы с областью применения углового UI modal

у меня возникли проблемы с пониманием/использованием областей для углового модального пользовательского интерфейса.

а не сразу вот, у меня есть модули и все настроено правильно (насколько я могу судить), но эти примеры кода в частности, где я нахожу ошибку.

<div class="btn-group">

    <button class="btn dropdown-toggle btn-mini" data-toggle="dropdown">

        Actions

        <span class="caret"></span>

    </button>

    <ul class="dropdown-menu pull-right text-left">

        <li><a ng-click="addSimpleGroup()">Add Simple</a></li>

        <li><a ng-click="open()">Add Custom</a></li>

        <li class="divider"></li>

        <li><a ng-click="doBulkDelete()">Remove Selected</a></li>

    </ul>

</div>

контроллер.js (опять же, важная часть)

MyApp.controller('AppListCtrl', function($scope, $modal){

    $scope.name = 'New Name';

    $scope.groupType = 'New Type';



    $scope.open = function(){

        var modalInstance = $modal.open({

            templateUrl: 'partials/create.html',

            controller: 'AppCreateCtrl'

        });

        modalInstance.result.then(function(response){



            // outputs an object {name: 'Custom Name', groupType: 'Custom Type'}

            // despite the user entering customized values

            console.log('response', response);



            // outputs "New Name", which is fine, makes sense to me.                

            console.log('name', $scope.name);



        });

    };

});



MyApp.controller('AppCreateCtrl', function($scope, $modalInstance){

    $scope.name = 'Custom Name';

    $scope.groupType = 'Custom Type';



    $scope.ok = function(){



        // outputs 'Custom Name' despite user entering "TEST 1"

        console.log('create name', $scope.name);



        // outputs 'Custom Type' despite user entering "TEST 2"

        console.log('create type', $scope.groupType);



        // outputs the $scope for AppCreateCtrl but name and groupType

        // still show as "Custom Name" and "Custom Type"

        // $scope.$id is "007"

        console.log('scope', $scope);



        // outputs what looks like the scope, but in this object the

        // values for name and groupType are "TEST 1" and "TEST 2" as expected.

        // this.$id is set to "009" so this != $scope

        console.log('this', this);



        // based on what modalInstance.result.then() is saying,

        // the values that are in this object are the original $scope ones

        // not the ones the user has just entered in the UI. no data binding?

        $modalInstance.close({

            name: $scope.name,

            groupType: $scope.groupType

        });

    };

});

создать.html (в своем целиком)

<div class="modal-header">

    <button type="button" class="close" ng-click="cancel()">x</button>

    <h3 id="myModalLabel">Add Template Group</h3>

</div>

<div class="modal-body">

    <form>

        <fieldset>

            <label for="name">Group Name:</label>

            <input type="text" name="name" ng-model="name" />           

            <label for="groupType">Group Type:</label>

            <input type="text" name="groupType" ng-model="groupType" />

        </fieldset>

    </form>

</div>

<div class="modal-footer">

    <button class="btn" ng-click="cancel()">Cancel</button>

    <button class="btn btn-primary" ng-click="ok()">Add</button>

</div>

Итак, мой вопрос стоит: почему область не является двойной привязкой к пользовательскому интерфейсу? и почему же this есть настроенные значения, но $scope не?

Я пытался добавить ng-controller="AppCreateCtrl" к телу div в create.html, но это вызвало ошибку: "неизвестный поставщик: $modalInstanceProvider

на данный момент мой единственный вариант-передать объект с this.name и this.groupType вместо $scope, но это неправильно.