0

我正在使用 AngularFire 创建一个简单的 Scrum 应用程序。基本上,用户可以注册,添加一些信息,然后在 Firebase 中创建一个用户。我正在使用 ng-repeat 在 team.html 页面上显示所有用户。

我目前有一个功能,允许用户单击“用户的磁贴”,它使用 ng-route 将您带到该特定用户的“dashboard.html”。我的dashboard.html 有一些更新用户的'color' 和'projectDescription' 属性的ng-change 指令——这些都与'DashboardController' 绑定。

如果“currentUuser”与dashboard.html 用户不同,我希望能够限制用户状态的更新。有人可以给我一个提示吗?

应用程序.js

var myApp = angular.module('myApp', 
['ngRoute', 'firebase', 'appControllers'])
.constant('FIREBASE_URL', 'https://scrumcheck.firebaseio.com/');

// Dependencies
var appControllers = angular.module('appControllers',['firebase']);

myApp.config(['$routeProvider', function($routeProvider){
$routeProvider.
    when('/login', {
        templateUrl: 'views/login.html',
        controller: 'RegistrationController'
    }).
    when('/team', {
        templateUrl: 'views/team.html',
        controller: 'MembersController'
    }).
    when('/views/dashboard/:uId/:mId', {
        templateUrl: 'views/dashboard.html',
        controller: 'DashboardController'
    }).
    when('/register', {
        templateUrl: 'views/register.html',
        controller: 'RegistrationController'
    }).
    otherwise({
        redirectTo: '/login'
    });
}]);

authentication.js(工厂)

myApp.factory('Authentication', function($firebase, 
  $firebaseSimpleLogin, FIREBASE_URL, $rootScope, $location) {

  var ref = new Firebase(FIREBASE_URL);
  var simpleLogin = $firebaseSimpleLogin(ref);

  var myObject = {

    login : function(user) {

      var userRef = new Firebase(FIREBASE_URL + '/users/' + user.uid);
      var userObj = $firebase(userRef).$asObject();

      userObj.$loaded().then(function() {
        $rootScope.currentUser = userObj;
      });

      return simpleLogin.$login('password', {
        email: user.email,
        password: user.password
      });
    }, //login

    register : function(user) {
      return simpleLogin.$createUser(user.email, user.password)
      .then(function(regUser){
        var ref = new Firebase(FIREBASE_URL + 'users');
        var firebaseUsers = $firebase(ref);

        var userInfo = {
          date: Firebase.ServerValue.TIMESTAMP,
          regUser: regUser.uid,
          firstname: user.firstname,
          email: user.email,
              image : "http://telehealth.org/wp-content/images/user-placeholder.jpg",
              color : "plain",
              projectDescription : "Currently working on...",
              yahoo : "yahooIM",
              upcoming : "PTO / WFH / OOO"
        }

        firebaseUsers.$set(regUser.uid, userInfo);
      }); //add user
    }, //register

    logout : function() {
      return simpleLogin.$logout();
    }, //logout

    signedIn: function() {
      return simpleLogin.user != null;
    }

    } //myObject

  //add the function to the rootScope

  $rootScope.signedIn = function() {
    return myObject.signedIn();
  }

  return myObject;
});

仪表板.html

    <div class="edit" id="frame-{{member.color}}">
        <div id="title-{{member.color}}" class="dashTitle">
        </div>
            <p class="userInfo">{{member.email}} | {{member.yahoo}}</p>
        <div class="dashimage">
            <img ng-src="{{member.image}}" id="frame-{{member.color}}">
        </div>

        <form name="dashColorForm"
            id="dashColorForm"
            novalidate>
            <div class="radio-toolbar">
                <input 
                    type="radio" 
                    id="radio1" 
                    name="radios" 
                    ng-model="color" 
                    ng-change="colorChange(color)"
                    value="green">
              <label for="radio1" id="greenRadio"></label>

              <input 
                type="radio" 
                id="radio2" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="grellow">
              <label for="radio2" id="grellowRadio"></label>

              <input 
                type="radio" 
                id="radio3" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="yellow">
              <label for="radio3" id="yellowRadio"></label>

              <input 
                type="radio" 
                id="radio4" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="orange">
              <label for="radio4" id="orangeRadio"></label>

              <input 
                type="radio" 
                id="radio5" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="red">
              <label for="radio5" id="redRadio"></label>

              <input 
                type="radio" 
                id="radio6" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="darkred">
              <label for="radio6" id="darkredRadio"></label>

              <input 
                type="radio" 
                id="radio7" 
                name="radios" 
                ng-model="color" 
                ng-change="colorChange(color)"
                value="unavailable">
              <label for="radio7" id="unavailableRadio"></label>

            </div>
        </form>

        <form name="dashProjectForm"
            id="projectForm"
            novalidate>
            <div class="dashprojects">
                <textarea 
                    name="projectDescription" 
                    id="memberproject" 
                    ng-model="projectDescription"
                    ng-change="dashProjectUpdate(projectDescription)"
                    placeholder="{{member.projectDescription}}">{{member.projectDescription}}
                </textarea>
            </div>
        </form>
        <p><a class="btn dashsubmit" ng-href="#/team">Go Back</a></p>
    </div>

仪表板.js

    myApp.controller('DashboardController', 
        function($scope, $firebase, $routeParams, $location, FIREBASE_URL){

        var whichMember = $routeParams.uId;
        var ref = new Firebase(FIREBASE_URL + 'users/'  + whichMember);
        var member = $firebase(ref);

        $scope.member = member.$asObject();

        $scope.colorChange = function() {
            var updateObj = $firebase(ref);

            var updateColor = {
                date: Firebase.ServerValue.TIMESTAMP,
          color : $scope.color
        };

            updateObj.$update(updateColor);
        }

        $scope.dashProjectUpdate = function() {
            var updateObj = $firebase(ref);

            var updateProject = {
                date: Firebase.ServerValue.TIMESTAMP,
          projectDescription : $scope.projectDescription
            };

            updateObj.$update(updateProject);
        }

    });

成员.json

{
  "users" : {
    "simplelogin:1" : {
      "date" : 1410328158691,
      "firstname" : "Adam",
      "image" : "http://www.charitydynamics.com/wp-content/uploads/2012/09/AdamKaye-Team.jpg",
      "color" : "red",
      "projectDescription" : "Currently working on...",
      "email": "test@email.com",
      "yahoo" : "yahooIM",
      "upcoming" : "PTO / WFH / OOO"
    }
4

1 回答 1

1

在dashboard.js 中:

var currentUser = $rootScope.currentUser;
$scope.isCurrentUser = function() {
  return currentUser.id == $scope.member.id;
};

然后在dashboard.html 中,您可以使用条件代码块:

<input ng-disabled="!isCurrentUser()">

<form ng-if="isCurrentUser()">

或类似的。

于 2015-03-11T00:10:52.080 回答