diff --git a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageHeader.vue b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageHeader.vue
index 1cf0a7d6f8a0..b9ec527671b0 100644
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageHeader.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageHeader.vue
@@ -4,8 +4,8 @@
       <v-card v-if="!landscape" width="50%" flat class="d-flex flex-column justify-center align-center">
         <v-card-text>
           <v-card-title class="headline pa-0 flex-column align-center">
-            {{ recipe.name }}
-            <RecipeRating :key="recipe.slug" :value="recipe.rating" :name="recipe.name" :slug="recipe.slug" />
+            {{ recipe.name }} {{ recipe.rating }}
+            <RecipeRating :key="recipe.slug" v-model="recipe.rating" :name="recipe.name" :slug="recipe.slug" />
           </v-card-title>
           <v-divider class="my-2"></v-divider>
           <SafeMarkdown :source="recipe.description" />
diff --git a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
index 5dce2ee29b0c..8ff9b7dfd29f 100644
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
@@ -19,7 +19,7 @@
     <RecipeRating
       v-if="landscape && $vuetify.breakpoint.smAndUp"
       :key="recipe.slug"
-      :value="recipe.rating"
+      :v-model="recipe.rating"
       :name="recipe.name"
       :slug="recipe.slug"
     />
diff --git a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageTitleContent.vue b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageTitleContent.vue
index c324e95ada8c..5ca840d86607 100644
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageTitleContent.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageTitleContent.vue
@@ -15,7 +15,7 @@
         <RecipeRating
           v-if="$vuetify.breakpoint.smAndDown"
           :key="recipe.slug"
-          :value="recipe.rating"
+          v-model="recipe.rating"
           :name="recipe.name"
           :slug="recipe.slug"
         />
diff --git a/frontend/components/Domain/Recipe/RecipeRating.vue b/frontend/components/Domain/Recipe/RecipeRating.vue
index 7487380be6e0..6df9cd2f1418 100644
--- a/frontend/components/Domain/Recipe/RecipeRating.vue
+++ b/frontend/components/Domain/Recipe/RecipeRating.vue
@@ -53,13 +53,12 @@ export default defineComponent({
 
     const api = useUserApi();
     function updateRating(val: number) {
-      if (props.emitOnly) {
-        context.emit("input", val);
-        return;
+      if (!props.emitOnly) {
+        api.recipes.patchOne(props.slug, {
+          rating: val,
+        });
       }
-      api.recipes.patchOne(props.slug, {
-        rating: val,
-      });
+      context.emit("input", val);
     }
 
     return { loggedIn, rating, updateRating };