Две директивы, ссылающиеся на одну переменную, но вторая директива не срабатывает при изменении

У меня есть две директивы, которые ссылаются на одну и ту же родительскую переменную. Первая директива - это выпадающий список. Вторая директива - это таблица. То, что я пытаюсь выполнить, следующее: когда в раскрывающемся списке сделан выбор, родительская переменная изменится. Вторая директива, использующая $ scope. $ Watch, обнаружит это изменение и загрузит данные в таблицу. Проблема в том, что вторая директива не обнаруживает изменения. Я не понимаю, почему.

// home.html
<div>
    <directive-one testid="home.changevalue"></directive-one>
    <br />
    <directive-two testid="home.changevalue"></directive-two>
</div>

// search.directive.html
<div style="margin-top:5px;margin-left:25px;">
    <div class="row" style="margin-bottom:10px;">
        <label for="searchoptions" style="margin-left:15px;">Food Items</label>
        <br />
        <select style="margin-left:15px;" name="searchoptions" id="searchoptions1" ng-model="searchFoodItems.fooditemid" ng-change="searchFoodItems.onSelectionChange()">
            <option value="">Select ...</option>
            <option ng-repeat="fooditem in searchFoodItems.fooditems" value="{{fooditem.entryid}}">{{fooditem.itemdesc}}</option>
        </select>
        &nbsp;&nbsp;&nbsp;
        <span>Food Item ID - {{searchFoodItems.fooditemid}}</span>
    </div>
</div>

// list.directive.html
<div style="margin-top:5px;margin-left:30px;">
    <table class="table table-responsive">
        <thead>
            <tr>
                <th>ID</th>
                <th>Description</th>
                <th>Discount</th>
            </tr>
        </thead>
        <tfoot></tfoot>
        <tbody>
            <tr ng-repeat="row in listFoodItems.fullitemdescs">
                <td>{{row.EntryId}}</td>
                <td>{{row.ItemDesc}}</td>
                <td>{{row.ItemDisc}}</td>
            </tr>
        </tbody>
    </table>
</div>

JS -

// home.js
    (function () {
        'use strict';

        angular
            .module(testConstants.generateName(testConstants.appModule, testConstants.NAMETYPES.module))
            .controller(testConstants.generateName('home', testConstants.NAMETYPES.controller), home);

        home.$inject = ['$scope', '$location', '$routeParams', '$q', '$window', 'logger', 'dataservice'];

        function home($scope, $location, $routeParams, $q, $window, logger, dataservice) {

            var home = this;

            home.changevalue = '';
        }
    })();


// search.js
(function () {
    'use strict';

    angular
        .module(testConstants.generateName(testConstants.appModule, testConstants.NAMETYPES.module))
        .directive(testConstants.generateName('directiveOne', testConstants.NAMETYPES.directive), searchFoodItems);

    searchFoodItems.$inject = ['dataservice', 'logger'];
    function searchFoodItems(dataservice, logger) {

        var sfi = {

            restrict: 'E',
            templateUrl: 'App/search/search.directive.html',
            scope: {
                fooditemid: '='
            },
            link: function (scope, element, attrs, controller) { },
            controller: searchFoodItemsController,
            controllerAs: 'searchFoodItems'
        }

        return sfi;
    }

    searchFoodItemsController.$inject = ['$scope', 'dataservice', 'logger'];
    function searchFoodItemsController($scope, dataservice, logger) {

        var search = this;

        search.fooditemid = '';
        search.fooditems = [];
        search.onSelectionChange = function () {
            $scope.fooditemid = search.fooditemid;
        }

        activate();

        function activate() {
            loadFoodItems();
        }

        function loadFoodItems() {

            return dataservice.getFoodItems().then(function (result) {
                search.fooditems = result;
                logger.log("search.directive.js = getFoodItems loaded");
            });
        }
    }

})();


// list.js
(function () {
    'use strict';

    angular
        .module(testConstants.generateName(testConstants.appModule, testConstants.NAMETYPES.module))
        .directive(testConstants.generateName('directiveTwo', testConstants.NAMETYPES.directive), listFoodItems);

    listFoodItems.$inject = ['dataservice', 'logger'];
    function listFoodItems(dataservice, logger) {

        var lfi = {

            restrict: 'E',
            templateUrl: 'App/list/list.directive.html',
            scope: {
                fooditemid: '='
            },
            link: function (scope, element, attrs, controller) { },
            controller: listFoodItemsController,
            controllerAs: 'listFoodItems'
        }

        return lfi;
    }

    listFoodItemsController.$inject = ['$scope', '$q', 'dataservice', 'logger'];
    function listFoodItemsController($scope, $q, dataservice, logger) {

        var list = this;

        list.fullitemdescs = [];

        activate();

        function watchFoodItem() {

            $scope.$watch("$scope.fooditemid", function (value) {
                $q.all([load(value)]).then(function () { logger.log('list.directive.js - fooditemid changed'); });
            });
        }

        function activate() {
            watchFoodItem();
            load($scope.fooditemid);
        }

        function load(id) {
            if (id === '') {
                loadFoodItems();
            }
            else {
                loadFoodItem(id);
            }            
        }

        function loadFoodItems() {

            return dataservice.getFoodDescDiscs().then(function (result) {
                list.fullitemdescs = result;
                logger.log("list.directive.js = getFoodItems loaded");
            });
        }

        function loadFoodItem(id) {

            return dataservice.getFoodDescDisc(id).then(function (result) {
                list.fullitemdescs = result;
                logger.log("list.directive.js = getFoodItem loaded");
            });
        }
    }

})();